Moment For Technology

How to use Webstorm effectively

Posted on Aug. 26, 2023, 2:43 a.m. by Edward Goddard
Category: The front end Tag: javascript The programmer The front end The command line

To be an effective programmer, you need not only quick thinking, but also quick operation.

At work, there are always a few experienced programmers looking at the code, writing the code at a rapid speed of file switching, screen switching, keyword search, etc. Sometimes, you still understand what he did, but he has found the code snippets.

India's teenagers are actually skilled workers in the workplace, and programmers are skilled in using ides in open Spaces.

Next, let's take Webstorm as an example and talk about how to take advantage of the convenience IDE brings to programmers to increase productivity.


Set keyboard shortcuts that fit your personal habits.

First, you need to sort out the IDE features you use most in your daily development. If you don't know the shortcut keys, go to the Keymap to find, or change to the key you want. Here are some of my favorite shortcuts.

  • Find in path: necessary. This is the most commonly used feature in current projects. Through keyword matching, regular expressions, pre-set search file scope, don't know how in the projectQuickly search for what you wantorSearch for completeCan seriously slow down your productivity. A good search configuration is therefore critical.
  • Enter the file name: necessary. Search for files by filename. It's worth noting that thisDifferent from theFind everywhereWhich is the default in WebStormPress Shift twiceThe function.Enter file nameWill automatically filter out by youmarkforlibrary rootandtestThe directory. Find file ratioFind everywhereSmaller, but moreaccurate.
  • Pull: Pull code. Moving the mouse to click a button in the corner is a waste of time.
  • Push: Push code.
  • Find usages:necessary. This is used to find the file of a function call or class call. Not very common when writing JS because lookups are incomplete; But when writing Java, especially refactoring, it can be very useful.
  • Recent files:necessary. Open the list of recently opened files. It is convenient to switch files.
  • Back:necessary. Return to cursor position last time. When you modify a piece of code in a very long file and then scroll to the other pieces of code, you can use this shortcut to quickly switch between those pieces of code.
  • Forward:necessary. The cursor moves to the next location.
  • Add watches:necessary. When debugging code, we want to be able to directly view the value of some variables or monitor the change of some variables as they are executed step by step. We can just select the variable field in the code and passAdd watchesQuickly add to watches. Very useful.
  • Rename:necessary. Rename the file. Webstorm renames the file,You can't just right-click a file and rename it, need to findrefactor renameCan. So setting up such a shortcut key can be very convenient.
  • Run:necessary. Common buttons, I won't go into details.
  • Debug:necessary. Common buttons, I won't go into details. Including every stepstepMake use of all the shortcut keys.
  • Terminal:necessary. A quick breathterminalTool. Very useful.
  • Parameter info:necessary. Parameter prompt. If the declared function hasjsdocThis parameter hint is even better where the function has been used.

In addition to these, there are many other practical quick functions, welcome to add.


Configure code highlighting for high appearance levels.

Code highlights, you can use some other people's color themes, and then modify them.

A theme with a high level of appearance will help developers better:

  1. Find the wrong spelling of English words.
  2. Undefined functions and variables are used.
  3. Distinguish between data types.
  4. Syntax specification and syntax simplification tips.
  5. The defined variable is not used. , etc.

Of course, there are problems that you can rely on a code quality check tool, but it is most effective to detect problems as they are written and prevent rework.

A gentleman is good at faking things. Improve your IDE. All progress begins with changing yourself.

About (Moment For Technology) is a global community with thousands techies from across the global hang out!Passionate technologists, be it gadget freaks, tech enthusiasts, coders, technopreneurs, or CIOs, you would find them all here.