Visual Studio Code is a streamlined code editor with support for development operations like debugging, task running, and version control. It aims to provide just the tools a developer needs for a quick code-build-debug cycle.
VS Code also has a build-in git integration and terminal, so you don’t have to jump from one window to another and it supports a large number of extensions that can be used for faster development.
So, here are some of the best and trending vs code extensions for you to start your development journey in 2021.
• How to install and browse extensions in VS Code.
You can browse and install extensions from within VS Code. Bring up the Extensions view by clicking on the Extensions icon in the Activity Bar on the side of the VS Code.
1. Live Server
Launch a local development server with live reload feature for static & dynamic pages.
2. Prettier
Prettier is an opinionated code formatter. It enforces a consistent style by parsing your code and re-printing it with its own rules that take the maximum line length into account, wrapping code when necessary.
3. CSS Peek
Allow peeking to CSS ID and class strings as definitions from HTML files to respective CSS. Allows peek and goto definition.
4. Bracket Pair Colorizer
This extension allows matching brackets to be identified with colours. The user can define which characters to match, and which colours to use.
5. Debugger for Chrome
Debug your JavaScript code in the Chrome browser or any other target that supports the Chrome Debugger protocol.
6. Visual Studio IntelliCode
The Visual Studio IntelliCode extension provides AI-assisted development features for Python, TypeScript/JavaScript and Java developers in Visual Studio Code, with insights based on understanding your code context combined with machine learning.
7. Project Manager
Helps to easily switch between projects.
8. Better Comments
Improve your code commenting by annotating with an alert, informational, TODOs, and more!
9. Advanced New File
Helps to create files anywhere in your workspace from the keyboard.
10. Auto Rename Tag
Auto rename paired HTML/XML tags.
11. Better Align
Align your code by a colon(:), assignment(=,+=,-=,*=,/=) and arrow(=>). It has additional support for comma-first coding style and trailing comment.
And it doesn't require you to select what to be aligned, the extension will figure it out by itself.
12. Bookmarks
Mark lines and jumps to them.
13. CodeSnap
Take beautiful screenshots of your code.📷
14. GitLens
Supercharge the Git capabilities built into Visual Studio Code — Visualize code authorship at a glance via Git blame annotations and code lens, seamlessly navigate and explore Git repositories, gain valuable insights via powerful comparison commands, and so much more.
15. JavaScript (ES6) Code Snippets
Code snippets for JavaScript in ES6 syntax.
Conclusion
In this article, I have shared with you my favourite extensions for Visual Studio Code which will help you to improve your performance of your development. Also, if you are a beginner, it may help you to focus on learning programming then on looking for an opening or closing bracket:)
Did I miss something? Please comment down below!
Happy coding!
Top comments (4)
Thanks for sharing. I use most of them and they all are excellent extensions in particular the tag renamer. I never used the codesnap ext but will surely give it a try.
U r welcome 😊 and do give it a try, that one is really awesome :)
Great list! Thanks for sharing.
Ur welcome 😊