Best visual studio code extensions for making life easy and help you improve your productivity.
Tags: visualstudiocode, webdev, productivity, beginners
Published: 2022-02-09 17:27:50

Hi, I am Daksh. I am here to help you improve your **productivity.** Today, I am gonna tell you some best Visual studio code extensions.

But first, I want you to join my **[<u>telegram channel</u>](https://t.me/dms_webdev)** because there I share best practices, tutorials, facts, quiz and many more to enhance you **Web Development** skills.  **[<u>Click Me for joining telegram channel</u>](https://t.me/dms_webdev).**



## What are Visual Studio Code extensions?

Extensions are basically external tools that helps you to implement new features. I hope you understood very easily. 


Now, let's get to the topic and see the best extensions of Visual Studio Code for improving your web development properties.

In total, there are 10 extensions that will help you to improve your writing skills, productivity and also save time.


**[Auto-Save on Window Change
](https://marketplace.visualstudio.com/items?itemName=mcright.auto-save)**

You can predict it's work from it's name. this extension helps you to to increase you coding efficiency. What exactly it does is when you switch from Visual Studio Code to any other software or window, it automatically saves the page.

For example - When you are creating front-end features and want to check your website in browser every time,  so it is irritating to press **ctrl+s** every time. So this is solution.

Every-time you switch the window, the page will automatically save.


**[Auto Rename tag](https://marketplace.visualstudio.com/items?itemName=formulahendry.auto-rename-tag)**

You must be thinking that this extension just auto renames the tags, but what exactly is renaming the tag?

Let's take a example - When you are writing codes, it is obvious that you will make **mistakes**. One of the mistake is that let's say you want to add a section tag but you placed div tag by mistake.

Then, you will have to delete the tag and add the tag another time, right? You will say, "What a big deal, I will do it so easily". Yes, it is easy to do this one time, two times, but you will start getting irritated the third time.

So, with the help of this extension, when you change the starting tag, the closing tag will automatically change. If you still can't understand, I recommend downloading and using the extension.

**[Better Comments](https://marketplace.visualstudio.com/items?itemName=aaron-bond.better-comments)**

We have been talking about extensions that are useful for HTML. But now, let's talk about a helpful extension for programming languages like JavaScript.

Better comments help you create comments in the right way. This extension allows you to categorise your comments in different colours.


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5fbs75uy9fnclbzkte45.PNG)

You can make your code very clear with this extension. You can mark wrong things with red and essential points with blue.

**[Quokka.js](https://marketplace.visualstudio.com/items?itemName=WallabyJs.quokka-vscode)**

How can we forget to run/debug JavaScript when talking about JavaScript? This extension helps you to run JavaScript in your editor.

So, now you don't have to go to the browser every time to watch your browser console. You can type console.log code and click on the run button on the top of the screen, and your JavaScript will work.




If you want to know more about extensions then visit **[this page.](https://codingscaler.blogspot.com/2022/02/best-visual-studio-code-extensions-for.html)**