10 WebStorm keyboard shortcuts you need to know

WebStorm is great programming software and it also has keyboard shortcuts for almost every operation. The following article will share the 10 essential keyboard shortcuts that every WebStorm user needs.

When using most software, we feel productive when we can perform frequently used tasks quickly. Shortcuts are always a long-standing solution and a great support for this purpose, helping users to save significant time. All of the WebStorm keyboard shortcuts in the article are available in the default keyboard diagram for Windows, Linux, Mac OS X 10.5 and above. You can easily customize the keyboard configuration in Preferences | Keymap .

Search everywhere: Shift + Shift

As its name suggests, popup Search everywhere allows users to search for any data in the project, as well as the IDE.

You can find files, symbols, functions, variables, classes or other components in code and quickly navigate to them:

10 WebStorm keyboard shortcuts you need to know

You can also search for tasks and run them.

10 WebStorm keyboard shortcuts you need to know

You can also search through IDE settings, even turn on or turn off some options right at the popup.

10 WebStorm keyboard shortcuts you need to know

Navigate to declaration: Ctrl + B (⌘B) or Ctrl + Click (⌘-Click)

You can instantly switch to a defined function, method or variable declarations, class, composition, CSS styles just by Ctrl-clicking on it or put caps on it and press Ctrl + B . This shortcut can also help you to the reference file or imported module.

10 WebStorm keyboard shortcuts you need to know

If WebStorm finds more than one declaration for the same function, you will be prompted to select one of them from the drop-down list.

Finalize the code by replacing: Tab

When you start typing data into WebStorm, the popup completes the auto-generated code to help with programming. Basically, you only need to press Enter to select one of the suggestions provided. However, if you need to replace a function or change the CSS class, press Tab and the current element will be replaced by the selected lookup item.

10 WebStorm keyboard shortcuts you need to know

Show related actions: Alt + Enter or ⌥-Enter

WebStorm has a lot of Intention that helps you quickly fix errors, create code, or change project settings. Put a caret in the highlighted code or underlined, then press Alt + Enter to see a list of related tasks available. For example:

10 WebStorm keyboard shortcuts you need to know

Do not want to see any warning? Choose Suppress to turn off checking that line of code or file, or Disable it for the entire project.

10 WebStorm keyboard shortcuts you need to know

Expand the selection: Ctrl + W or ⌥-Up Arrow

With the Extend selection task, you can quickly select any code block without using a mouse:

10 WebStorm keyboard shortcuts you need to know

Run ...: Alt + Shift + F10 or ⌃⌥R

The fastest way to run one of the project's Run configurations is to press Alt + Shift + F10 on Windows or Ctrl-Alt-R on a Mac and select a configuration from the popup.

10 WebStorm keyboard shortcuts you need to know

Tip : Hold Shift and press Enter to Debug configuration instead of running it.

Open the Expand Live template: Tab

The Expand Live template is really a solution that saves you a lot of time. Type the short abbreviation, then press Tab to expand it in the code. Move from the placeholder of one variable to another in the template by pressing Tab again.

WebStorm has a rich collection of Templates, including Postfix templates. You can also add your own custom templates.

10 WebStorm keyboard shortcuts you need to know

WebStorm also supports Emmet abbreviations for HTML and CSS. You can expand them with Tab.

Multi-cursor: Alt + Click

The popular multi-cursor feature is also available at WebStorm. Press Alt + Click to use multiple cursors at once, then edit their positions simultaneously.

10 WebStorm keyboard shortcuts you need to know

New Scratch File: Ctrl + Alt + Shift + Insert or ⇧⌘N

With Scratch file, you can quickly create code samples or write notes while working in the IDE, without affecting the project file, but still get code support. Scratch file is saved in the IDE. You can easily access it from any project.

10 WebStorm keyboard shortcuts you need to know

Refactoring the code: Alt + Control + Shift + T or ⌃T

Code refactoring is a prominent feature of WebStorm. To quickly access the refactoring list available for selected codes, press Alt + Control + Shift + T or Ctrl-T :

10 WebStorm keyboard shortcuts you need to know

Other keyboard shortcuts

For a complete list of default keyboard shortcuts, visit the Keymap reference table in the IDE via Help | Default keymap reference or here .

Alternatively, through the Keymap configuration in Preferences | Keymap . Here, you can search by task name or shortcut:

10 WebStorm keyboard shortcuts you need to know

Also, remember the shortcut for Search Everywhere , you can see related shortcuts or try the Visual Shortcut Mapper with the default WebStorm keymap available.

Hopefully the above shortcuts will help you save time and use WebStorm effectively as you like.

Sign up and earn $1000 a day ⋙

Leave a Comment

How to play dinosaur games right on Android screen

How to play dinosaur games right on Android screen

The T-rex dinosaur game is very familiar to many people and you can enjoy this T-rex dinosaur game right on your Android screen.

Sword World Origin: Overview of 10 sects in the game

Sword World Origin: Overview of 10 sects in the game

Kiem The Origin - the mobile version of Kiem The on PC released by VNGGame. Like the previous PC version, Kiem The Origin owns 10 sects with 20 different systems for you to freely choose your own gameplay.

Call of Duty fights hacking by making real gamers invisible

Call of Duty fights hacking by making real gamers invisible

A new anti-hack, anti-cheat method is being developed by the game Call of Duty.

How to hide ads when playing games on your phone

How to hide ads when playing games on your phone

Turn off ads while playing games, something that many mobile gamers want after finishing a round.

How to get free mobile games on Epic Games Store

How to get free mobile games on Epic Games Store

Epic Games Store on Android has a free game download program like on PC. Here is a guide to get free mobile games on Epic Games Store.

Instructions for playing Pokemon catching game on Google

Instructions for playing Pokemon catching game on Google

Just by searching Pokemon names on Google, you will collect the latest Pokemon characters.

Tencent brings Android games to Microsoft Store Windows 11

Tencent brings Android games to Microsoft Store Windows 11

Earlier this year, Microsoft announced its decision to discontinue the Windows Subsystem for Android, which was designed to allow Android apps to run natively on Windows 11.

Special characters ϟ, ✿, \˚ㄥ˚\, ☎,☂, ☁ special characters or

Special characters ϟ, ✿, \˚ㄥ˚\, ☎,☂, ☁ special characters or

Special characters do not appear on the keyboard, but you have to find them in special ways. With the pre-made character table below, you just need to write the content or a character name that you want to put in the game, then copy the text format that you like best!

How to Never Pay for Games and Apps on Android

How to Never Pay for Games and Apps on Android

When it comes to making purchases on the Play Store, many people haven't spent any real money in years, thanks to Google Opinion Rewards.

Learn About Resizable BAR: Settings That Give You Extra Gaming Performance

Learn About Resizable BAR: Settings That Give You Extra Gaming Performance

If you don't know about Resizable BAR and how it improves performance, then chances are you have it disabled. Here's how you can enable Resizable Bar and what to expect from this feature.

Chat and have fun with 6 fun iMessage games

Chat and have fun with 6 fun iMessage games

If you want to have fun with opponents from different parts of the world, you can try out interesting iMessage games, in many different genres.

Top 7 Best Game Launchers to Launch and Organize PC Games

Top 7 Best Game Launchers to Launch and Organize PC Games

If you have a large collection of PC games, it can be difficult to remember which games are installed in which launcher. Luckily, there are a few ways you can launch all your PC games without having to open each launcher.

Websites That Help You Build Your Own Game in Minutes

Websites That Help You Build Your Own Game in Minutes

Just visit the following websites where you can build your own game in just a few minutes.

How to play games on WePlay

How to play games on WePlay

WePlay Boardgame is a great way to play board games with friends or strangers from all over the world.

This is a game that requires a microscope to play.

This is a game that requires a microscope to play.

Patrick Gillespie introduces the new Subpixel Snake game based on the classic game and has shrunk the game down to the point where users need a microscope to play it the way they want.