DEV Community

Cover image for 11 VS Code Features & Tricks You Should Know as a Developer

Posted on • Originally published at

11 VS Code Features & Tricks You Should Know as a Developer

1. Fonts With Ligatures

Fonts with ligatures make code more clean and handy when working with big projects, you can make your editor experience much better with exceptional fonts in conjunction with ligatures. There are several fonts available that support ligatures, but you can simply stick with the classic Fira Code.

To enable ligatures in VS Code you just have to add “editorLigatures”: true in VS Code settings file.

2. Rainbow Indent

This VS Code extension colorizes the indention in front of your text alternating four special colors on every step if you write code in JavaScript and Python then this feature is quite useful for neat-looking code.

3. Tag Wrapping

If you are tired of typing things repeatedly then you should understand emmet, emmet allows you to write an abbreviated code and get the returned corresponding tags quickly. The latest version of emmet has support for the majority of the Emmet Actions including expanding Emmet abbreviations and snippets.

To use tag wrapping:

Select text.
Open command palette.
Execute Emmet: Wrap with Abbreviation.
Enter a tag div (or an abbreviation).
Then hit Enter.

4. Turbo Console.log()

Instead of typing console.log repeatedly, you should preserve your time when you simply need to output some things fast. Turbo Console Log is an awesome extension in VS Code that solves this problem, it enables the logging of any variable on the line below with an automatic prefixing following the code structure.

5. Multi Cursor Editing

One of the most helpful features in VS Code that I personally love, with multi cursor editing you can edit multiple lines within a quick. There are several methods for multi cursor editing as given below:

ALT-CLICK: If you want to insert multiple cursors through a document that aren’t on consecutive lines, you have to just simply hold ALT and click on each line.

CTRL-U: Just in case you clicked the wrong line and don’t want to go all over again with selecting lines, then just press CTRL+U to undo the last cursor operation.

SHIFT-ALT with Arrow Keys: If you selected a word and want to include the quotes or anything that surrounds near it, just simply use the SHIT+ALT with the arrow keys to expand your selection area.

SHIFT-ALT-Drag: Using this key combination allows you to create a rectangular selection.

Read More at:

Top comments (0)