Visual Studio Code Tips and Tricks

Visual Studio Code or VS Code is developed by Microsoft for use on Windows, Linux, and Mac operating systems and is free for both private and commercial use. If you don’t already have Visual Studio Code installed, go to the VS Code Download page where you can find platform-specific setup instructions for macOS, Linux, and Windows. These are a few common useful VS Code tips & tricks. Here are a few tips and tricks for new or seasoned VS Code users.

ZEN MODE

Zen Mode is a distraction-free view. All the extra toolboxes and bars in your window will be removed, allowing you to completely focus on your code. To enable Zen Mode select View > Appearance > Toggle Zen Mode.

You can centre-align your code in Zen Mode to experience a view like a document editor. To toggle in and out of the centred layout, View > Appearance > Toggle Centered Layout.

SPLIT VIEW

Split View allows you to multitask and work on several files simultaneously, or if you need to check the difference between two files, then use split view. Split View can be customised based on your preferences, whether you like to layout files vertically or horizontally.

To use Split View, click and drag the file tab in the VS Code window and VS Code will display different split view options or select View > Editor Layout > Split Up.

Exclude folders

The exclude folder option can be used to remove unwanted folders you don’t want to open in Visual Studio Code. To exclude a folder, go to File -> Preferences -> Settings (or on Mac Code -> Preferences -> Settings), and search for file.exclude in the search settings. You can add the pattern of the folder you don’t want Visual Studio Code to open.

Edit multiple lines simultaneously

With VS Code, you can edit multiple lines by adding cursors to different locations. This is really useful if you are going to use the same code on different lines. Instead of copying and pasting the code in all places, you can hold Alt and click (CMD + D on Mac) to add a cursor in the places you want to type or edit the code. After adding cursors, edit the code to see the changes in the places where the cursors were added.

Command-line

VS Code has a powerful command-line tool that allows you to do many things. The ones that got my attention the most are:

• Use commands from your extensions
• Open preferences
• Change theme

To use the command line, hold CMD + shift + p on Mac (CTRL + shift + p on Windows).

Try it.

VS Code is not only a great code editor, but it has many tools and plugins available to make your development life easier. If you haven’t used VS Code yet, give it a go, you have nothing to lose!