Visual Studio Code is a lightweight code editor that includes features for debugging, task execution, and version management. It seeks to give developers only the tools they need for a rapid code-build-debug cycle, leaving more sophisticated workflows to full-featured IDEs like Visual Studio IDE. Visual Studio Code extensions can be used to add new features, themes, and other customizations.
In this article, I’ll show you how to use some of the most popular VS code extensions to increase your productivity and make your work easier in a variety of ways.
Let’s have a look at some VS Code extensions we will cover in this article:
- Brackets Colorizer
- Live Server
- Git Lens
- Code Spell Checker
- Auto Rename Tag
- Git History
- Markdown All in One
- Import Cost
Prettier ensures that you don’t have to bother about retyping your code. It’s a powerful, opinionated code formatter that lets you format your code in a logical manner. It saves time and energy because the code is formatted. By using CTRL+SHIFT+P, you can customize your formatting.
You can checkout the extension in the marketplace Prettier
With so much nested code, brackets are a developer’s worst nightmare. It’s nearly impossible to see which brackets match up with which other bracket pair colorizer colors matching brackets to make your code a lot easier to understand.
You can checkout the extension in the marketplace Brackets Colorizer
When writing code, we frequently switch between our IDE and the browser to inspect the results of our most recent code changes. Your browser updates when it needs to with the help of a live server. Every time you save your code, the changes are immediately visible in the browser. It starts a local development server that supports both static and dynamic page reloading.
You can checkout the extension in the marketplace Live Server
Eric Amodio invented, developed, and maintains GitLens, an open-source addon for Visual Studio Code.
It’s a fantastic git management add-on that allows you to do a lot of things.You look at the git history, line, and commit logs.
You can checkout the extension in the marketplace Git Lens
You can checkout the extension in the marketplace TabNine
You can checkout the extension in the marketplace Vetur
Code Spell Checker
This spell checker’s purpose is to help you catch common spelling mistakes while minimizing false positives. It, like Grammarly for word documents, highlights misspelled technical terms or variables within comments and strings. Hit F1 in VS Code and type ext select install, then code-spell-checker. To enable, press enter and reload the window.
You can check out the extension in the marketplace.
Auto Rename Tag
By default, whenever you rename an opening tag in HTML, you must also replace the closing tag manually. However, with this tool, your open and close tags are renamed automatically.
You can checkout the extension in the marketplace Auto Rename Tag
This program allows you to see line-by-line commit history as well as prior versions of the file. To get started, simply import the result of your git-log.
You can checkout the extension in the marketplace Git History
You can checkout the extension in the marketplace Quokka
Markdown All in One
Markdown All in One is a simple extension that handles all of your markdown requirements, including auto-preview, shortcuts, and autocomplete. When it comes to dealing with markdown files, many companies have started utilizing markdown as one of their document editors, therefore markdown extension is the ideal when it comes to working with markdown files.
You can get the extension here Markdown All in One
Import Cost is an extension that displays the size of the import package in your code as an estimate. It’s critical not to jeopardize the user experience by importing hefty packages when working on a project. Keeping track of the size of additional dependencies in your code is one method to avoid this.
You can checkout the extension the marketplace Import Cost
In this article, we have reviewed some VS Code extensions that can help in boosting your productivity as a developer and also save time. Thanks for reading and don’t forget to try out these extensions.