DEV Community 👩‍💻👨‍💻

Cover image for Must have extensions for VS Code (according to me)
Christian Vasquez
Christian Vasquez

Posted on • Updated on

Must have extensions for VS Code (according to me)

Everyone has things they can't live without, whether it is your pet, a really loud neighbor, taxes, the dank memes, or even water! (This is my way of reminding you and myself to drink water more often, got it? ok, let's keep going).

But this time I wanna talk about an editor that has a special place in my heart:

Visual Studio Code
(VS Code, in case you didn't read the title)

This little bad boi comes with some pretty cool features out of the box:

  • Intellisense
  • Integrated version control
  • Markdown support with previewer
  • Built in terminal
  • Peek definition
  • Debugger
  • And blah blah blah... let's get to the good part:

Plugins! wait, no.

Extensions! 👏

These are basically a way to add extra functionality to your existing editor to make it go over 9,000 (WHAAAT?!).

Alright, alright, alright. Enough chit-chat.

List of extensions I can't live without

Auto Close Tag

Automatically rename paired HTML/XML tag, same as Visual Studio IDE does.

Auto Rename Tag

Automatically rename paired HTML/XML tag, same as Visual Studio IDE does.

Auto import

Automatically finds, parses and provides code actions and code completion for all available imports. Works with Typescript and TSX.


Automatically formats your JavaScript, HTML and CSS code. (Yeah, like magic!).

Clipboard History

Keeps a history of your copied and cut items and let's you re-paste them if needed.

Git History

View git log along with the graph and details. You can view the history of a file or a specific line.

Code Runner

Let's you run a file or a selected part of your code to quickly check the output. I normally use it when working with JavaScript, but it supports quite a wide range of other languages as well.


Do I really need to explain this one? If you don't know what Docker is by now, go ahead and google it. You can thank me later 😉.

(Jk. You can go here, here and here for more Docker goodness).

Material Icon Theme

What? Don't you like cute little icons on your explorer? Ok, then. Skip this one if you want.

Path Intellisense

I mean... the name says it all, doesn't it?

CSS classes intellisense

Aids you by giving you hints of possible CSS class names that are already in your project so you don't have to constanlty switch tabs over and over.

NodeJS Modules Intellisense

Autocompletes the names of the core NodeJS modules and the ones you specified in your package.json available for you. Quite useful when starting to learn about Node.


If you are learning/using NodeJS, chances are that you are also going to be using ExpressJS, so this extesion provides a few code snippets so you can focus on your logic rather than the boilerplate around your get(), post(), put(), delete() methods.


This extension is similar to jshint. It warns you of possible mistakes in your Markdown code that is commonly used in open source projects across GitHub and other version control hosting platforms in a way, whether it's a or, they all use Markdown.


Allows you to copy and paste blocks of code that you want and transform them into a screenshot with a good looking standard template. (Similar to how window-based screenshots look in MacOS).

Aaaaand it's over

That's it. These are my favorites extensions so far.

Do you have some extensions that could replace the ones I mentioned? Or would you add some more to the list?

Go ahead and let me know below, I'm always up for extension hunting.

Top comments (49)

telmotrooper profile image
Telmo "Trooper"

I'd recommend Live Server as well. It's quite useful.

chrisvasqm profile image
Christian Vasquez

Would you mind explaining what it does or a link to it for others?

telmotrooper profile image
Telmo "Trooper"

It runs a web server in the root directory of your project so as to automatically update the page once you edit anything. Check the gif in its marketplace page:

ericcurtin profile image
Eric Curtin

Tried Visual Studio code.

Still find vim and a terminal is more productive for my needs! Each to their own.

chrisvasqm profile image
Christian Vasquez • Edited on

That's totally cool. I know a few people who love Vim but I have never used it.

What are some the things that you prefer from Vim over VS Code?

ericcurtin profile image
Eric Curtin • Edited on


Vim starts fast and consumes minimal memory.

Largest syntax highlighting support you can find, in terms of languages.

Fingers don't have to leave the keyboard.

I can go to line 18790 of a file make a change within a second or two.

Massive plugin library (although I'm sure VS Code is big too).

I'm a Unix/Linux developer, so the ability to ssh to a remote system and make a change really quickly is important for productivity, may not apply if your primary development platform is Windows.

Almost every Unix/Linux system has vim installed, or at least it's closely related sister vi.


The main one, steep learning curve.

C/C++ indexing could be improved upon. But VS Code is just as poor. QT Creator and full VS have decent indexing. Although full VS is a bit bloated, can be slow to start up and work with.

If you're a Unix/Linux developer in particular, learning vi/vim would be a string to your bow that you will be thankful for adding. Even most Emacs user know some vi/vim as Emacs isn't always installed.

It's more productive on Windows too in my opinion, but I'm not as convinced it's worth the effort learning if Windows is your primary development platform.

Thread Thread
chrisvasqm profile image
Christian Vasquez

Wow! I'll have to give it a try too!


markbloomfield profile image
Markus • Edited on

One of the more useful Extensions I use, is the Slack integration. It allows me to select a selection of code or even an entire file, and send it right into my Slack instance. It can send as a DM to someone, or into the channel you specify.

It's a great workflow for sharing code with team members - useful snippets, or something you're having a problem with.

Then AdvancedNewFile is great for quickly creating a new file. CMD-Alt-N will drop down the palette where I can specify the starting folder, and then just type out the path to the new file I want to create and it'll build/out/the/path-to-the/file.html. Quite useful :)

nexwebsites profile image
NexWebSites • Edited on

Great article Christian. For us the number one extension is the Go extension by Luke Hoban. It makes VS Code into a very useful and productive environment for Go development.

For C# development, Visual Studio is still the boss.

chrisvasqm profile image
Christian Vasquez

Thanks NexWebSites, this is the first time I read about someone using Go in VS Code. What do you guys use it for?

nexwebsites profile image
NexWebSites • Edited on

We use Go for everything from microservices, web services, to complete high performance servers. You name it. IMO, many applications are much more fun and effective written in Go. And that is coming from someone who has been writing in C# and Java since they were first released.

Although it is a great product, if it wasn't for the Go extension, we wouldn't even have VS Code on our machines.

Thread Thread
chrisvasqm profile image
Christian Vasquez • Edited on

That sounds awesome. Props to Luke Hoban for his initiative!

emptyother profile image

Thanks for a few good suggestions.

If you write a lot of javascript or typescript, instead of Code Runner I would recommend Quokka.js. Learned about it from a youtube channel named Fun Fun Functions.

Other than that, my MUST HAVEs are Settings Sync, Contextual Duplicate, Markdown Checkbox, Sort JSON objects, and Log Output Colorizer so far.

chrisvasqm profile image
Christian Vasquez • Edited on


nicolasparada profile image
Nicolás Parada

AddFileExtension and don't forget to bind the command "addfileextension.addFile" with the Ctrl + Alt + N keyboard shortcut. It allows you to easily create files without the mouse.

miku86 profile image

What is the difference between Ctrl+Alt+N and Ctrl+N?

nicolasparada profile image
Nicolás Parada • Edited on

This extension is a little more smart. It will create folders and files relative to the current open file or root if none. Also support absolute path from root.

larrybuza profile image
rbukovansky profile image
Richard Bukovansky

File icons: vscode-icons - first file icons for VSCode (AFAIK) and they are still best looking (IMHO).
Code alignment: Alignment - if you need to align those assignment rows (:=, = etc.) to look prettier
Bookmarking code: Bookmarks - you know what to do with it, right? :)
EditorConfig: If you need to force codestyle in your team
Guidelines: Guides - draws guiding lines between brackets
Markdown: Markdownlint, Markdown PDF
Syncing VSCode config: Shan Khan's Settings sync (already mentioned earlier by somebody else)
ToDo: TODO Highlight (searches code for TODO: FIXME: etc., highlights them in code as well as lists them)

antero_nu profile image
Antero Karki

Clipboard history sounds nice, or if there is an undo for the action when you accidentally push copy instead of paste.

Not a plugin but I've recently discovered ligatures with the fira code font and for me it's the biggest improvement in code readability since color coded text.

gustavoagt profile image
Gustavo Gómez

Well i recommend you,

1) Bracket Pair Colorizer
Basically allows matching brackets to be identified with colors.

2) Angular Language Service (If you use Angular)
provide us a rich editing experience for Angular templates

chrisvasqm profile image
Christian Vasquez

NIce ones!

Those are pretty cool.

wosi profile image
Christopher Wosinski

GitLens is a must have:

chrisvasqm profile image
Christian Vasquez

That's right! How did I miss it?

Thanks, Christopher :D

lucasprag profile image

Great list!

dancombs profile image

VS Code with 20 extensions...curious about the performance...

chrisvasqm profile image
Christian Vasquez

Haven't really noticed much of an impact on load times to be honest.

But now that you mention this, I'll look into it. Thanks!

chrisvasqm profile image
Christian Vasquez • Edited on

For anyone who may wonder:

Here'a post about performance issues and how to work around them for version 1.19 or later. And this one is for version 1.18 or older.

jenc profile image
Jen Chan • Edited on

What the intellisense! I have been using VSC for a couple months and I had never heard of this. (switched over, deliberately without watching tutorials to see what is so great about it).

The sweetest thing coming over from sublime, is the built in Terminal and git history.

mbaas2 profile image
Michael Baas

I really like vscode-powertools - allows you to add buttons for configureable actions to the status-bar.

With todo-tree I keep track of TODO-comments in my code. VERY useful!

And I use the "Bad Code Highlighter" to highlight my typical problem: unpaired quotes. (You can configure a rx and if it find it, it would highlight the line)

Finally I found Favorites Manager to be useful to keeo a list of my favourtite file easily at hand.

Hey 😍

Want to help the DEV Community feel more like a community?

Head over to the Welcome Thread and greet some new community members!

It only takes a minute of your time, and goes a long way!