Every so often, we get some feedback about the lack of up-to-date, comprehensive learning resources for WebStorm. For new users, this scarcity can result in a steep learning curve during the onboarding stage. For existing users, it means a lack of content that would help them further excel at what they do.

Regardless of which group you’re in, we’ve got some good news for you: We’ll be releasing new educational materials throughout the year in order to address this problem.

The first of these resources is the learning plugin for WebStorm. Let’s see why you may want to download it and take a look at how to get the most from it.

First things first: who’s the plugin for?

With the help of the learning plugin, you can interactively learn how to execute some common tasks, such as refactoring code, navigating through projects, running unit tests, and more. The plugin includes a short training course divided into several modules, each with a number of lessons that teach you how to do a specific task. There is no need to go through all the lessons – you can choose to do only the ones you find most relevant.

This plugin will be most useful for those who are new to WebStorm. However, if you’re an experienced WebStorm user and feel like checking whether you know all the basic shortcuts, feel free to try it out. We’d be happy to learn whether the information in the training is at all helpful to users already familiar with WebStorm.

Installing the plugin and starting to learn

To install the plugin, go to Preferences/Settings | Plugins and search for IDE Features Trainer.

Once the plugin is installed, restart the IDE and you’ll see the new Learn WebStorm option on the welcome screen. To get started, click on it.

Next, you’ll see the Learn tool window, which includes all the available modules and a link to the survey for sharing feedback.

To start learning, click on a module you find interesting. You’ll automatically be redirected to the task for the first lesson, or, if you’re resuming learning, the task where you left off.

Getting the most out of the plugin

Let's briefly review the structure of the training course. It comprises three modules:

• Editor Basics. By taking five short lessons in this module, you can learn how to save time on common tasks. You’ll find out how to use code completion and refactorings, edit code with multiple carets, quickly navigate through projects, and more. If you only have time for completing one of the three modules, we recommend considering this one.
• WebStorm Debugger 101. This module will give you an overview of how to run and debug programs with Node.js in WebStorm. It’s most useful for those who have previously used the debugging capabilities of other IDEs and would like to know how the debugger in WebStorm is different.
• Getting Started with Testing. This is the shortest module, consisting of only one lesson. It explains the fundamentals of unit testing in WebStorm using the popular Jest framework as an example. You’ll find this module interesting if you plan to do unit testing in WebStorm.

The training format we’ve decided on may take some bit of getting used to, and there are some technical limitations that we’re planning to eliminate. For a better learning experience, we’d recommend keeping in mind the following tips:

• When working through some lessons, you’ll see information about how a specific functionality related to the main topic of the lesson works without being prompted to try it out (e.g. different ways to step through code when talking about the debugger). If you’d like, you can test how the described functionality works and then undo your last action by using the default OS shortcut (Cmd+Z/Ctrl+Z) to move on with the lesson.
• If you’d like to start a lesson over from scratch, you can click on its name below the training instructions. This will reset your current progress.
• In some lessons, you’ll have to work with dialogs that may prevent you from looking at the training instructions, especially if you’re doing the training on a device with a smaller screen (13-inch or less). Feel free to adjust the size of these dialogs, or you can drag and drop them to a more convenient place.

We encourage you to share your feedback with us! Just leave a comment below or fill out this survey. We’re also excited to note that a few more helpful resources are coming soon, so please stay tuned!

The WebStorm team