WebStorm 2019.1 Help

Guided Tour Around WebStorm User Interface

Here you can learn how the WebStorm user interface is organized to help you find your way through your working environment.

When you first run WebStorm or have no project opened, WebStorm displays the Welcome screen which enables quick access to the major entry points. When you opened a project, WebStorm displays the main window.

The main window consists of areas, which are shown on the picture below, marked with numeric labels:

The Main window
  1. Main menu and toolbar — contain commands that affect the entire project or parts of the project, such as opening, creating a project, refactoring the code, running and debugging applications, keeping files under version control and more.

    The main toolbar duplicates the main menu's essential commands for quicker access. By default, the main toolbar is hidden. To show it, select View | Toolbar from the main menu.

  2. Navigation bar — a quick alternative to the Project Tool Window. Use it to navigate across your project and open files for editing.

    Use View | Navigation Bar to hide or show the navigation bar; press Alt+Home to bring the application focus to the navigation bar.

  3. Status bar  — indicates the status of your project, the entire IDE, and shows various warning and information messages.

  4. Editor  — here you can read, create, and modify your code.

  5. Tool windows — secondary windows that provide access to project management, search, running and debugging, integration with version control systems, and other tasks.

Last modified: 25 March 2019

See Also