Visual Studio Code is an amazing editor used by most of the developers in today’s world of programming and is commonly used for Web Development, Application Development, and way more stuff.
It comes with the ability to add extensions for a customised and better programming experience for rapid application development. Here we have a list of the most popular and important extensions for VS Code.
- Settings Sync
- GitLens
- Prettier
- Better Comments
- Live Server
- Auto Rename Tag
- TODO Highlight
- Code Spell Checker
- Debugger for Chrome
Check out Best Themes for VS Code
Settings Sync
Settings Sync is entirely free, open-source, and has over 2 million installs to date. Settings Sync solves the annoying problem of not having your workspace set up available to you. With Settings Sync, you can take snippets, themes, file icons, key bindings, and extensions to wherever you need them with the help of GitHub Gists.
GitLens supercharges the Git capabilities of Visual Studio Code. This is a powerful extension that allows you to see who, why, and how lines of code have changed over time (among lots of other features).
GitLens is a highly customizable extension. If you don’t like a particular setting, you can easily turn it off in settings.
Prettier is an opinionated code formatter that works particularly well if you have multiple people working on a single project because the extension enforces a consistent style.
You can set it up so it formats your code every time you save it, significantly reducing the amount of time you need to spend formatting your code.
Live Server
This is one of my favourite extensions. Live Server launches a local development server with a live reload feature both for static and dynamic pages.
Every time you save your code, you’ll instantly see the changes reflected in the browser. You’ll be much faster at spotting errors and it’s much easier to do some quick experiments with your code.
Auto Rename Tag
Auto Rename Tag was first launched on the Marketplace in 2016. It has since grown to over 6 million downloads and is extensively used by developers to help with the simple yet repetitively pesky task of renaming paired HTML/XML tags.
Auto Rename Tag saves both time and developer sanity.
TODO Highlight
I confess. I’ve been guilty of writing TODOs in my comments to then totally forget about them. TODO Highlight makes them stand out much more.
You can toggle the highlights and can also list all the highlighted annotations and reveal them from the corresponding file.
Code Spell Checker
Although it isn’t life-threateningly important, I prefer my code to have no spelling errors. Code Spell Checker underlines words that it doesn’t recognize in its dictionary files.
The extension is available in many different languages and supports jargon such as medical terms.
Debugger for Chrome
Developed by Microsoft, Debugger for Chrome allows you to debug your JS code in VSCode. Contrary to debuggers in other IDEs, it’s surprisingly smooth.
You can set breakpoints, step your way through the code, debug scripts added dynamically, and more.