Top 12 VS Code Extensions

Visual Studio Code Extensions make your workflow so much more efficient and enjoyable in VS Code. This article provides a list of some of my favorite VS Code extensions. There is no ordering from best to worst.

1. Auto Rename Tag

If you change an HTML/XML tag, this extension will automatically update the paired tag.

2. Bracket Pair Colorizer

This extensions’ intuitive colorizing of matching brackets (and parentheses) makes it easier to see where a block starts and ends

3. Live Server

This extension launches a local server with live reload. This extension is great for updating static HTML/CSS/JS files quickly without creating your own server.

4. Prettier

Have you been formatting your code manually? No more. This extension will format your code for you on save.

5. Live Share

Do you want to work on a project with a friend or teammate? This extension allows you to collaborate on a project in VS Code in real-time. Think Google Docs but for code!

6. Quokka.js

This extension allows you to test out JavaScript and TypeScript code on the fly in an in-editor playground.

7. Import Cost

When you import a package into a file in VS Code, this extension will show you how much memory that package takes up.

8. GitLens

This extension allows you to visualize code authorship via Git blame annotations and code lens. You can also navigate in the history of a file back and forth to see the changes that were made on it.

9. Path Intellisense

This extension will auto-complete filenames and file paths for you as you type them.

10. Snippets

This is not a single extension but a collection of extensions that provide code snippets for specific languages and frameworks. Using snippets allows you to not have to type as much. The example I’m showing here is the ES7 React snippets for React developers.

11. Better Comments

This extension augments your ability to create more human-friendly comments in your code. You can categorize your annotations with different colors.

12. VS Code Icons

This extension adds icons to your files in the sidebar so it is easier to tell which is which when there is a lot of files.

Go check out all of these great extensions!

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s