Features Tutorials WebStorm

Find your way around your code

You constantly move around your project – switching between editor tabs, navigating to files, directories, classes, functions, comments, declarations, and so on and so forth. It’s easy to lose direction when you move and always have to think where to find the one line or place in code you need right now.

If there’s a key metric for being productive and efficient while coding, it has to do with cutting the time you lose on side actions such as configurations, line/file/class search, navigation, etc. This time should be minimized as much as possible.

For this reason, a smart IDE aims to guide you around your code, to help you keep up your coding pace, and not scroll thousands of source code lines just to find something you need. Here we provide an overview of must-know navigation methods that JetBrains IDEs offer.

This functionality is available in IntelliJ IdeaPyCharmWebStormPhpStorm, RubyMineAppCode.

  • Find action. Find the desired action without digging through menus or toolbars (covers the commands of the main menu and various context menus, commands performed through the toolbar buttons of the main toolbar and tool windows). Choose Help | Find Action from the main menu or press Ctrl+Shift+A / Cmd+Shift+A. Press it one more time to include the non-menu commands in the suggestion list:

  • Go to file. Quickly navigate to the desired file, specified by name. The IDE suggests a list of matching names from which you can select the one you need and open it in the editor. This navigation honors CamelCase and snake_case capitalization, as well as wildcards. Press Ctrl+Shift+N / Cmd+Shift+N to invoke this:

  • Go to class. Quickly navigate to the desired class specified by name. Press Ctrl+N / Cmd+N to invoke this:

  • Go to symbol. Quickly navigate to the desired symbol specified by name. Press Ctrl+Shift+Alt+N / Cmd+Shift+Alt+N to invoke this:

  • Go to declaration or type declaration of a symbol. Navigate to the location where a particular named code reference (a symbol) has been first declared. To navigate to the declaration of a symbol: place the caret at the desired symbol and choose Navigate | Declaration or press Ctrl+B / Cmd+B or click the middle mouse button. Keeping Ctrl pressed, point to the symbol, and click, when it turns to a hyperlink. You can also see declaration at the tooltip while keeping Ctrl pressed:To navigate to the type declaration of a symbol: place the caret at the desired symbol and choose Navigate | Type Declaration or press Ctrl+Shift+B / Cmd+Shift+B. Keeping Ctrl+Shift pressed, point to the symbol, and click when it turns into a hyperlink. You can also see declaration at the tooltip while keeping Ctrl+Shift pressed:
  • Go to line. Navigate to a line by its number. Choose Navigate | Line or press Ctrl+G / Cmd+G:

  • Find usages. If you want to navigate from a symbol to one of its usages within your application, press Alt+F7, or choose Find Usages on its context menu.There are several commands that help you find out where a certain symbol is used: you can jump from one usage to another in the current file (Ctrl+F7 / Cmd+F7), view usages in the current file color-coded (Ctrl+Shift+F7 / Cmd+Shift+F7), or across a whole project in a popup list (Ctrl+Alt+F7 / Cmd+Alt+F7):
  • Search. Search in source code with Ctrl+F / Cmd+F: start typing your search string, and immediately navigate to its occurrences in the current file. The IDE goes even further: it helps you look for a certain string within a directory, or any arbitrary scope, or an entire project (Ctrl+Shift+F / Cmd+Shift+F):

  • Quick search. Quick search is the easiest way to find a file: make sure the Project tool window has focus, start typing and you’ll see the matching nodes highlighted in the tree view. In fact, this method of finding files or symbols works in any tool window:

Learn these essential navigation and search practices and you’ll find your way around your code in no time!

Develop with pleasure!
– JetBrains Web IDE Team