Vscode best extension

15 best extensions in VScode to improve your productivity

Trend Guides

15 best extensions in VScode to improve your productivity

Coding is the backbone of every business. It builds up millions of applications that support services to achieve its goals. Thanks to coding, many people have finally had the chance to approach different life purposes. Some may use it as a tool to support their community. Some with an even bigger aim of helping the world become a better place. Others want to have a job in the tech industry because they can make a lot of money. Different people have different targets. However, since coding benefits the world with a powerful impact, it’s never been a piece of cake. 

To become a good coder, it’s important to be patient and hard-working. It requires a bit of logical thinking as well. But all of those have never been enough for coders to finish their work. They will also need a little support from technology to get the job done. Therefore, I’m going to show you the 15 best extensions that you must install on your VScode to increase your productivity.  

Let’s get started.

Setting Sync 

This is probably the foremost extension in the pack. It lets you sync almost everything that you have customized on VScode to Github such as your keyboard configuration, settings, and other extensions. By that, you can enjoy working with your favorite setup. Having more joy during a long day of coding can help stimulate your productivity effectively. 

Setting Sync also allows you to quickly save one setup and use it on another device. Now, you don’t have to worry about manually changing your settings from the beginning. Only a few easy steps and you’re ready to go. 

Live Server

Live Server makes your job a lot easier. It’s a live reload feature that updates your changes immediately. Whenever you make a small change to your codes, you don’t have to worry about reloading the page anymore. It automatically does the work for you. 

Remote SSH

As the name suggests, this extension lets you work on your development remotely. 

This tool lets you open any file or folder on a remote machine through an SSH server with all the VScode features on it. As soon as it’s connected to a server, you can easily connect to a folder remotely on the remote filesystem. 

Source code is not needed since the extension operates commands and other extensions directly on the remote device. 

Prettier 

Prettier helps format your code in a standard format. This works for group work if there are multiple people working on the same project. Prettier keeps everything consistent so that no one has to manually format the codes every time they’re on it. 

TODO highlight

It may not seem an important extension for many people but it definitely is for me. I had been desperately writing my TODO on a piece of paper but constantly forgot about it. TODO highlight makes the list much more obvious. Also, it’s easier to keep track compared to the traditional handwriting method. 

There are features that make your TODO stand out as well. This makes it harder to ignore even if you do it intentionally. 

Gitlens

Speaking of keeping track of your codes, Gitlens is another integral piece for a group project. It tells you why, how, and who changes the line of codes. 

Also, it’s customizable since you can turn off a setting instantly if you don’t like it. 

Git history 

Most of the time, you can see current changes, manage branches, and perform diffs by using the available feature in VScode. But as a coder, you need more than that basic information. Git history lets you have an in-depth view of it. Git history can show you: 

  • View how, when, and what has been done to a line or file
  • Compare brancher, commit, files across commits 

Peacock 

Peacock sounds like a cool name for an extension, doesn’t it? Its function is pretty simple: It changes the color of your VScode environment. 

Normally, a developer tends to open multiple VScodes to work on a project. It’s important to tell which one they need to be using next. Having everything in the same color makes it annoying to switch between one to the other. Therefore, paint them all differently so that your productivity won’t be affected. 

Colorize 

Another helpful coloring tool that helps increase your productivity. For all the CSS/Less/SASS/… files, it’s no longer a pain in the neck to navigate where and what you’re doing with your codes. 

Bracket Pair Colorizer

We all know how difficult it is to recognize which brackets belong to each other. Therefore, giving each pair a different color is such a great idea. Especially for beginners, this will give you a better visual to distinguish between certain codes and symbols. 

Auto rename tag 

You might have known that whenever you open a new tag, VScode will automatically close it for you. Auto name tag has the same functionality. It changes the name of the other end of the tag while you’re changing the other. 

So convenient, isn’t it? 

Code spell checker 

If you’re a web developer, you certainly don’t want any wrong spellings on the website. It’s embarrassing if a customer spots out a spelling mistake. And like anybody else, I cannot detect every mistake as I make it. Therefore, code spell checker is definitely your number one companion to make your work more efficient. 

Bookmarks

You may have used Bookmarks a lot of time on Google Drive or on any other platform. Bookmarks on VScode also play the same role. It helps you bookmark different codes so that you can flexibly take a look at them at any time with just a click. 

VScode-icons 

This one tool may help make your daily routine much more interesting. It changes the icons of the VScode files and the color of them. It doesn’t affect anything related to coding but at least, you’ve got something to enjoy during long working hours. 

Debugger for chrome 

This is an extension developed by Microsoft. It allows you to debug codes written in JS on VScode. No doubt that it’s one of the smoothest debugging tools according to a lot of coders. 

There you have it, the 15 best extensions that will help you out with increasing your productivity. If you want to know more about Tech in general, or coding specifically, make sure to follow Techvify for more Tech stories and articles. Stay tuned!!!