DEV Community

Cover image for My Best VSCode Productivity Tips, Shortcuts and Tricks
Zil Norvilis
Zil Norvilis

Posted on

My Best VSCode Productivity Tips, Shortcuts and Tricks

While working on my coding projects I have learnt and developed quite a few productivity tips and tricks, that helps me achieve the goal much quicker and 'fancier'. In this article I will share my top Productivity tips and shortcuts.

Better Comments

Better Comments Banner
First of all, I want to share a nice extension - “Better Comments” which basically highlights your code comments with different colors, and makes it easier to read and easier to understand the code. While normally the comment is green, by adding the keyword ‘TODO’ in your comment, the extension will turn it into orange, and if you add an exclamation point the comment becomes red.

Extra tip for turning code into comments faster. Instead of manually adding two slashes (‘//’) in front of the line that you wish to become a comment, you can use a shortcut ‘CTRL + /’ on Linux/Windows or “CMD + /’ on MacOS. This works for both single line and multiple lines selected.

AI AutoCompletion

TabNine Banner
Tab Nine is the most awesome Auto Compeltion tool I know. It really is smart and suggests stuff better than any similar tool I had before. I find it very useful in my day to day coding sessions. If you are truly serious about coding, then This VSCode extensions is a must!

Side Panel Shortcuts

Side Panel Shortcut Banner
These are the keyboard shortcuts that I use most often. They speeds up the general flow and navigation around your code-base.

Hide the Side Panel

'Ctrl + B'
(or 'Cmd + B' on Mac)
Enter fullscreen mode Exit fullscreen mode

Show Extensions Panel

'Ctrl + Shift + X'
(or 'Cmd + Shift + X' on Mac)
Enter fullscreen mode Exit fullscreen mode

Show Explorer Panel

'Ctrl + Shift + E'
(or 'Cmd + Shift + E' on Mac)
Enter fullscreen mode Exit fullscreen mode

Integrated Terminal

Integrated Terminal Banner
There is integrated terminal inside VSCode and using it saves a lot of navigating through program windows. You can have any number of terminal tabs running inside the editor.

Show/Hide Integrated Terminal

'Ctrl + ~'
(or 'Cmd + ~' on Mac)
Enter fullscreen mode Exit fullscreen mode

Quick Search

QUick Search Banner
Finding every file inside huge code-base could be pretty difficult task to do. Fortunately, VSCode offers some great feature to make this task less painful. To find any file quick you need to use this:

'Crl + P'
(or 'Cmd + P' on Mac)
Enter fullscreen mode Exit fullscreen mode

These are my most used VSCode's Tips, Tricks and Hacks. To find even more you can watch my video here: https://www.youtube.com/watch?v=umct1TvwduI

Top comments (2)

Collapse
 
tabnine profile image
Tabnine

Thank you for this great article, Zil! We are delighted to be your awesome VS Code extension!

Collapse
 
zilton7 profile image
Zil Norvilis

Thank you for making this awesome tool 🙂