Make coding a joy with these core VSCode extensions and settings

Visual Studio Code (VSCode) has rapidly become the favored editor/IDE for a huge swath of web developers. This is in no small part due to its robust extensions marketplace and the fact that you can change how pretty much every little aspect works.

I’ve been using it for the past few years of webdev work with a myriad of technologies (Node.js, Typescript, vanilla JavaScript, Vue.js, Svelte.js, HTML/CSS, Docker, and on and on), and it’s only let me down when I strayed too far from web technologies.

Below are the core extensions and settings I’ve settled on for general JavaScript/Node-centered web development, that have collectively made my work an absolute joy.

VSCode Extensions

There are extensions for pretty much everything, and you’ll definitely need to track down the best ones for your particular technology stack. For most JavaScript-based stacks, the following extensions form a great core:

VSCode Settings

Code environment settings can be very personal, or can be dictated from above for matching across a team. In any event, here are the ones I’ve settled on over time (to edit yours in VSCode, Ctrl+Shift+P then Preferences: Open Settings (JSON) ):

"editor.fontFamily": "'Fira Code', Consolas, 'Courier New', monospace",
"editor.fontLigatures": true,
"js/ts.implicitProjectConfig.checkJs": true,
"eslint.validate": ["javascript","html","vue","typescript"],
"git.autofetch": false,
"": "C:\\Program Files\\Git\\bin\\bash.exe",
"": ["-l"]

If you want to use the Fira Code font, you’ll need to first install it.

The terminal... fields are for setting Git Bash as the default terminal, if that's the sort of thing you're into.

CTO and Fullstack Webdev at Butterscotch Shenanigans

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store