Top 5 Visual Studio Code extensions

9 months ago

So you have downloaded and started using Visual Studio Code. You have installed a few different extensions and realize there are a ton that you can use to make your editor that much better.

. . .

Welcome devs! In this article we will go over the top 5 Visual Studio Code extensions to install.


The eslint extension will analyze your code to warn you against errors in your code. This is extremely useful when writing code and you need a second pair of eyes looking at it. Sometimes writing JavaScript can be tiring and other languages are more strict. JavaScript is more loosely typed and more prone to errors. Use this extension to warn you of errors in your code before you ship it.


The prettier extension is pretty amazing. If you are a sloppy coder and don't want to take the time to perfectly line up curly braces and white space then this extension is for you. It's even awesome using it in a team, everyone's code will be perfectly formatted to your specifications and all the coders will have consistency.


The Gitlens extension is very useful if you use git as a repository to store your code. Git is a repository service that can store your code and make revisions, and collaborate with other devs. With Gitlens you can see who made changes to the code, even look at your own changes, to make sure you know what is happening to your updates as you push out new code.

Color Highlight

The Color Highlight extension is awesome for front end developers. When you see web colors in your editor it will show you what the color actually is within the editor. No need to go back and forth between applications to see what the color is.

Live Server

The Live Server extension is great for viewing and reloading web pages in development. You can serve a folder of html pages and have them reload when you make changes. No need for any other applications. If you need to quickly see what an html file looks like in the browser then this can easily help you.

Bonus - Version Lens

The Version Lens extension will analyze your package.json file and let you know what version of each package you have installed. It will also show you if you can upgrade any of those packages to their latest deploy. Be careful though, upgrading a package without knowing the consequences can sometimes break your code.

So those are the top 5 Visual Studio Code extensions that I recommend. Please feel free to leave a comment and share your top 5 Visual Studio Code extensions.

Happy coding!

9 months ago