Are you switching to VSCode and looking for some useful extensions? Below is a collection of my favorite VSCode extensions.

Html Tag Wrap

This extension lets you select a word, sentence or multiple lines and wrap selection in a specified html tag (Alt + W or Option + W).

Install htmltagwrap for VSCode

React.js code snippets

If you are working with React.js you will find these snippets very useful.

rcc will create React class component skeleton, rsc will create React stateless component and much more.

Install React.js code snippets

Npm Intellisense and Path Intellisense

When working with React.js you end up importing other modules very often. The following two extensions will save you a lot of time by autocompleting your import statements.

Npm Intellisense autocompletes npm modules in import statements and Path Intellisense autocompletes filenames.

Git Blame

Git Blame will add a git blame information to the status bar. This helps you to quickly see who made the last changes to the working file and who to blame for the messy code:)

Install Git Blame

Git History

If you need to see even more detailed history of commits, Git History is your best friend.

Install Git History

Bookmarks

One of the most useful extensions from this list is Bookmarks. It lets you to create a bookmark anywhere in your files (ctrl+alt+k or cmd+option+k) and then quickly jump between bookmarks by pressing cmd+option+j or cmd+option+l.

Very handy especially if you are working with long files and need to jump to the right sections of your code.

Install Bookmarks

Sublime Text Keymap

If you are migrating from Sublime Text, this extension will make your favorite Sublime Text shortcuts available in VSCode.

Install Sublime Text Keymap

HTML Class Suggestions

This VSCode extension will add code completion suggestions to HTML class attributes based on the CSS files in your workspace.

Install HTML Class Suggestions

Open in Browser

I am not sure why this is not build-in functionality of VSCode, but this extension lets you open your html files in the browser.

Install Open in Browser

SVG Viewer

If you want to preview your SVG images and icons directly in VSCode, install this extension.

Install SVG Viewer

Random

Not the most frequently used extension, but sometimes it is very handy to be able to create a random number, address or phone number.

Install Random

BEM Expand

BEM Expand lets you expand your BEM classes in HTMl and JSX files.

Install BEM Expand

Auto Close Tag

Automatically close your html and xml tags like Visual Studio or Sublime Text does.

Install Auto Close Tag

Auto Rename Tag

This extension will auto rename both opening and closing html or xml tags for you.

Install Auto Rename Tag

Alignment

This extension will align your code like in Sublime Text 3 Alignment Package.

Install Alignment

Conclusion

Are you using VSCode? What some of your favorite extensions? Let me know in the comments.

And if you need even more extensions check out some more useful extensions post by Valerii Iatsko – Awesome VSCode

Note: all images are courtesy of the extension authors.