VSCode tips and tricks

#vscode #productivity

From time to time I spend some time with playing tools I use everyday in order to be more productive. It's easy to keep using the features I already know, even though there is a better way. This week I played with VSCode, here is what I learned.

Shortcuts

Navigation

I usually used the touchpad or Cmd + P to select a file from the sidebar or navigate between open files, but using shortcuts made it much quicker. You can switch between the editor and the sidebar by pressing Cmd + Shift + E, then navigate by cursor key and open the selected file with Cmd + Down. To switch between open tab Ctrl + Tab or Ctrl + Shift + Tab can be used.

Insert line

I did not know that I can insert a new line below or above the current line by pressing Cmd + Enter and Cmd + Shift + Enter respectively. Usually I navigated to the end or beginning of the current line and pressed Enter, but it is much easier with these shortcuts.

Go to/peek definition

This is not new for me, but I put it here as it is very useful feature. If you press F12 VSCode jumps the definition of the symbol under the cursor. If you press Alt + F12 VSCode does not jumps there, but open the definition as an overlay, so you can have a quick look. It is worth to mention Cmd + Shift + O that opens a list of symbols, so you can jump to any of them very quickly.

Others

Ctrl + Shift + G Show Git
Ctrl + K, P Copy full path of the current file
Ctrl + K, W Close all open files
Ctrl + K, R Reveal current file in explorer
Cmd + Ctrl + Shift + Right Expand selection
Cmd + Ctrl + Shift + Left Shrink selection

Extensions

Overtype

I always missed overtype mode from VSCode, but finally found this extension. It shows the current mode in the status bar and by pressing Cmd + Shift + I you can switch to overtype mode and back.

TODO Highlight

I usually use TODO and FIXME tags in comments to mark what I have to do later, and just use VSCode 'Find in files' function to find these marks later. Of course there is a better way: TODO Highlight. It is a very simple, but very useful extension. By default it highlights TODO: and FIXME: in your code, but it is highly configurable: other tags can be added, files can be included or excluded. It also can give you a list of all tags in your project.

Thanks for reading it. Happy coding. ❤

Say hello.
LinkedIn | Github | Instagram