20 VS Code Shortcuts For Pro Developers

VS Code is one of the most used code editors among developers, and it has some amazing features to help developers increase their coding speed.

As a conclusion, in this article, I’ll go through 20 VS Code shortcuts that I find the most useful when I’m coding. If none of them apply to you, don’t worry; you should be able to learn and use at least a few shortcuts the next time you open VS Code. When it comes to starting something new…

The following shortcuts can be used to open and close the sidebar without having to click on the left-hand side tab.

  • Mac — Command + B
  • Windows — Ctrl + B
  • Ubuntu — Ctrl + B

Closing the sidebar is very useful when you are in the split editor mode.

Opening and closing sidebar Vs shortcuts

2. Select word

This is used to select the word where your cursor currently is.

  • Mac — Command + D
  • Windows — Ctrl + D
  • Ubuntu — Ctrl + D

You can keep selecting the same occurrence of the term if you press the shortcut many times.

Select word vs shortcuts

3. Split Editor

A split editor (also known as a side-by-side editor) is useful when you need to compare two files or refer to another file while making changes to another file.

  • Mac — Command + \ or 2,3,4
  • Windows — Shift + Alt + \ or 2,3,4
  • Ubuntu — Shift + Alt + \ or 2,3,4
Split Editor visual studio shortcut

4. Code folding

If the file is too long, we might need to fold and unfold blocks of code to understand the code better.

This can be done using the following.

Folding the innermost uncollapsed region at the cursor:
  • Windows/Ubuntu — Ctrl + Shift + [
  • Mac — Command+ Option + [
Unfolding the collapsed region at the cursor:
  • Windows/Ubuntu — Ctrl + Shift + ]
  • Mac — Command+ Option + ]

5. Copy line up/down

If you need to copy the current line to the line above or below, the following shortcut can be used.

  • Mac — Shift + Option + Up/Down
  • Windows — Shift + Alt + Up/Down
  • Ubuntu — Ctrl + Shift + Alt + Up/Down
Copy line up/down vs shortcut

6. Code formatting

Code formatting allows indenting the code based on the rules already set up in the editor.

  • Windows — Shift + Alt + F
  • Mac — Shift + Option + F
  • Ubuntu — Ctrl + Shift + I

7. Trim trailing white spaces

This will help get rid of white spaces at the beginning or end of the line.

Trim trailing white spaces vs shortcut

You can change your VS code properties to trim whitespaces automatically in your settings by modifying the user settings tab like below:

Preferences > Settings > User Settings tab

Add a new “files.trimTrailingWhitespace”: true setting to the User Settings documents if it’s not already there. Afterwards, when you save a file, this will be automatically applied, and the whitespaces will be removed.

8. Join line

This allows you to join the selected set of lines into a single line.

Join line vs shortcut
  • Mac — Ctrl + J
  • Ubuntu, Windows — Open keyboard shortcuts from File > Preferences > Keyboard shortcuts, and bind editor.action.joinLines to a shortcut you prefer.

9. Quick file open

Quick file open vs shortcut
  • Mac — Command + P
  • Windows/Ubuntu — Ctrl + P

10. Command Palette

This is one of the most important key combinations to know in VS Code. You can access all available commands based on your current context using:

  • Windows/Ubuntu: Ctrl +Shift + P
  • Mac: Command + Shift + P
Command Palette vs shortcut

11. Toggle terminal

It’s common to use several terminals when developing a web application, and you can easily toggle between them using:

  • Mac — Command+backtick (Command+`)
  • Windows/Ubuntu — Ctrl+backtick (Ctrl+`)

12. Switch Tabs

This allows you to switch between the sections you’ve split.

Switch Tabs vs shortcut
  • Mac — Command+1, Command+2, Command+3
  • Windows/Ubuntu — Ctrl+1, Ctrl+2, Ctrl+3

13. Select current line

This selects the current line where your cursor is at.

Select current line vs shortcut
  • Mac — Command + L
  • Windows/Ubuntu — Ctrl + L

14. Delete line

  • Mac — Command + Shift + K
  • Windows/Ubuntu — Ctrl + Shift + K

15. Move line

  • Mac — Option + Up/Down arrow
  • Windows/Ubuntu — Alt + Up/Down arrow

16. Find word/phrase

find word phrase vs shortcuts
If you need to find from the current file
  • Mac — Command + F
  • Windows/Ubuntu — Ctrl + F
If you need to find from the entire project
  • Mac — Command+Shift + F
  • Windows/Ubuntu — Ctrl+Shidt + F

17. Peek Definition

The Peek Definition feature allows you to view and edit the source code of a referenced symbol right on the spot.

Peek Definition vs shortcut
  • Mac — Option + F12
  • Windows/Ubuntu — Alt + F12

18. Rename

This will allow you to rename a component and replace the subsequent occurrences of the component name as well.

Rename vs shortcut
  • Mac/Windows/Ubuntu — F2

19. Multi cursor selection

VS Code supports multiple cursors for fast simultaneous edits. You can add secondary cursors using:

  • Mac — Option + Click
  • Windows/Ubuntu — Alt + Click
Multi cursor selection vs shortcut

20. Duplicate line

You can make the duplications of the same line using:

  • Mac — Command + Shift + D
  • Windows/Ubuntu — Ctrl + Shift + D

Conclusion

As I said before, there are a variety of shortcuts available in VS Code. However, every developer who works with VS Code should be aware of the shortcuts listed above.

I hope you found some exciting shortcuts in this list to make your coding more efficient, and if there are any other tips of your own, don’t forget to share them in the comments.

Thanks for reading ✌️

Leave a Comment