Developer Productivity

10 useful VS Code shortcuts that will make your coding life easier

Phuong Vu

July 18, 2024

Share via Social Media

Constant switching between keyboard and mouse in VS Code can disrupt your workflow and concentration. To maximize productivity, it's crucial to leverage keyboard shortcuts in this powerful code editor. 

Here are 10 indispensable VS Code shortcuts that developers should master:

1. Quick Open (Ctrl+P / Cmd+P)

This shortcut opens a search bar that allows you to quickly navigate to any file in your project. Type part of the filename, and VS Code will show matching results in real-time. This is incredibly useful for large projects where manually navigating through folders would be time-consuming.

2. Command Palette (Ctrl+Shift+P / Cmd+Shift+P)

The Command Palette gives you access to all of VS Code's functionality. You can run any command, change settings, or even install extensions without leaving your keyboard. It's a powerful tool for customizing your workspace and executing less common actions quickly.

3. Multi-cursor editing (Alt+Click / Opt+Click)

This feature allows you to edit multiple lines simultaneously. It's handy when you need to make the same change in various places. You can also add cursors above or below the current line using Ctrl+Alt+Up/Down (Cmd+Opt+Up/Down on Mac).

4. Find and Replace (Ctrl+F / Cmd+F)

While this is a common feature in most text editors, VS Code's implementation is powerful. It supports regular expressions and can search across multiple files. Use Ctrl+H (Cmd+Opt+F on Mac) to open the replace functionality.

5. Toggle Sidebar (Ctrl+B / Cmd+B)

This shortcut allows you to quickly show or hide the sidebar, giving you more screen space for coding when needed. It's particularly useful when working on smaller screens or when you want to focus solely on your code.

6. Go to Definition (F12 or Ctrl+Click / Cmd+Click)

This feature takes you directly to where a function, variable, or class is defined. It's invaluable when navigating complex codebases or when you need to understand how a particular piece of code works.

7. Split Editor (Ctrl+\ / Cmd+)

This shortcut splits your editor, allowing you to view multiple files side by side. It's extremely useful when comparing code, referencing documentation while coding, or working with related files simultaneously.

8. Toggle Terminal (Ctrl+` on all platforms)

This shortcut opens or closes the integrated terminal in VS Code. Having a terminal directly in your editor can save time switching between windows when you need to run commands, start servers, or perform other CLI operations.

9. Comment/Uncomment Line (Ctrl+/ / Cmd+/)

This shortcut allows you to quickly comment or uncomment the current line or selection. It's useful for temporarily disabling code or adding explanatory comments without disrupting your workflow.

10. Rename Symbol (F2)

This powerful refactoring tool allows you to rename a variable, function, or class across your entire project. VS Code will automatically update all references, saving you from the error-prone process of manual find-and-replace.

Get started with DevZero today.

Say goodbye to localhost limitations in less than 5 minutes.

Get Started