DEV Community

Cover image for Every VS Code extension a JavaScript web developer should have in 2021 (with gifs!)

Every VS Code extension a JavaScript web developer should have in 2021 (with gifs!)

Zak Laughton on February 09, 2020

Visual Studio Code is a powerful editor out of the box, but there are many many VS Code extensions to make it even more powerful! If you're new to...
Collapse
 
cadams profile image
Chad Adams • Edited

If you like Fira Code checkout JetBrains Mono personally I like JetBrains Mono more.

Collapse
 
mittalyashu profile image
Yashu Mittal

That's a good looking Mono font.

I suggest you should also try the Cascadia font, it is free and open source.

Prior to this, if there was any other font I want to use that was Operator Mono since it was really expensive I couldn't buy it.

and when I came across Cascadia font, I was like

Collapse
 
zaklaughton profile image
Zak Laughton

Ooh, that does look nice. I like the comparisons they have on the site too. Might have to try this out. Thanks for sharing!

 
zaklaughton profile image
Zak Laughton

Nice! Looks like this is was disabled in my editor for some reason. Probably was disabled when I installed the other extensions. Works great in .html files! Hopefully the VS Code team can do the same for React JSX soon too 🤞.

Collapse
 
zaklaughton profile image
Zak Laughton

Yikes, thanks for the heads up! I have been noticing issues related to this lately, but didn't realize it was being caused by the extension itself. I've uninstalled it and updated the post.

I haven't seen VS Code natively auto-update corresponding tags in HTML files or JSX in React.js files, unfortunately. Would love to see this functionality without the performance issues.

Collapse
 
paul7337 profile image
paul7337

Great article, thanks! Rainbow CSV is occasionally quite useful to have around.

Collapse
 
anandshenoy14 profile image
Anand Shenoy

I dont know how Search Node Modules did not make your list. Just a terrific way to jump and debug node modules.

Collapse
 
frankmuts profile image
frankmuts

Just a small thing:
The link to "javascript console utils" is wrong, it brings you to "indent-rainbow"

Collapse
 
zaklaughton profile image
Zak Laughton

Oops...fixed it. Thank you!

Collapse
 
fat_tonyy profile image
Fat-Tony

html.mirrorcursoronmatchingtag was buggy as well, use this instead which came with version 1.44
"editor.renameOnType": true,

Collapse
 
elanandkumar profile image
Anand Kumar

Fira code and Jetbrains Mono is good but would suggest to try this out;

recursive.design

After using this, I stopped thinking about Dank Mono and Operator mono. :)

Collapse
 
faahdnoor profile image
Fahad Noor

Debugger For Chrome, Local History, and Tech Debt Tracker are also handy.