My FeedDiscussionsHeadless CMS
New
Sign in
Log inSign up
Learn more about Hashnode Headless CMSHashnode Headless CMS
Collaborate seamlessly with Hashnode Headless CMSΒ for Enterprise.
Upgrade ✨Learn more

Know Your Vs Code Extensions!

Anshika Agarwal's photo
Anshika Agarwal
Β·Aug 11, 2021Β·

2 min read

### What is Visual Studio Code?πŸ€” Well Visual Studio Code is an editor that is here to make your life easy .At its heart, Visual Studio Code features a lightning fast source code editor, perfect for day-to-day use. With support for many languages, VS Code helps you be instantly productive with syntax highlighting, bracket-matching, auto-indentation, box-selection, snippets, and more.

Why do I need to know about its extensions anyway? 🀨

To make your life easier! The features that Visual Studio Code includes are just the start. VS Code extensions let you add languages, debuggers, and tools to your installation to support your development workflow. basically they help you in every way possible to make your code look clean, non-repetitive and easy to understand!

From where can I add these extensions? πŸ‘€

You can browse and install extensions from within VS Code. Bring up the Extensions view by clicking on the Extensions icon within the Activity Bar on the side of VS Code or the View: Extensions command (Ctrl+Shift+X). To install an extension, select the Install button. Once the installation is complete, the Install button will change to the Manage gear button

SO HERE ARE SOME BASIC VS CODE EXTENSIONS THAT YOU MUST KNOW ABOUT :

1) Prettier-(code formatter): This extension performs the formatting of the JavaScript, CSS, and HTML code. While writing code we often mess up the format making our code look ugly . so Prettier is here to rescue you from that!

2) Live Server : if you are a front end web developer , this is a must for you. this extension automatically reloads your webpage as soon as you save your code. No need of the annoying refreshing anymore!

3) Code time : This extension tracks your development time and provides you with useful stats like what percentage hours you've got code today etc. It’s pretty useful to stay track and see the progress. This is not strictly for web development only, anyone can use this extension.

4)Auto close Tag: This extension automatically adds the closing tag of HTML and XML. Thank me later πŸ™‚

5)Bracket pair colorizor : Brackets are the bane of a developer's existence. With plenty of nested code, it gets almost impossible to work out which brackets match up with one another . Bracket Pair Colorizer (as you would possibly expect) colors matching brackets to form your code far more readable. Trust me, you want this!