My favorite Visual Studio Code extensions

Brandon Lara
6 min readAug 2, 2021
Photo by Mohammad Rahmani on Unsplash

Visual Studio Code is a code editor highly valued by programmers, this is due, among other reasons, to its simplicity, to the functionalities it offers, since it is completely free and open source. However, one of the most important elements of VS Code is the possibility of installing extensions to customize, extend and improve the functionalities and appearance of the editor. These extensions are also completely free, developed and maintained by the community, and can be easily found on the Extensions Marketplaceintegrated into the editor itself. This has led to many of these VS Code extensions being indispensable in the work of many programmers today. In my case, I use several extensions to improve and facilitate my work, personalize my user experience, and to increase my productivity.

If you still don’t know about Visual Studio Code extensions, the following video shows more information about them:

Next, I am going to show my favorite extensions based on the usefulness they have provided me, how interesting they seem, and my personal taste.

Bracket Pair Colorizer 2

It is an extension that paints the pairs of parentheses or braces the same color to be able to identify them in a simple way.

It is especially useful when we have highly hierarchical data structures or many blocks of code at different levels. For this reason, it is highly recommended to use this extension if we work with JavaScript, React or JSON, since it is very common to nest elements and have code blocks at different levels, due to the nature of the language regarding objects, promises, callbacks and arrow functions.

In my case, using this extension saves me a lot of time when it comes to finding the scope of any block of code, especially in Javascript and its frameworks, but also in other programming languages.

Code Time

This extension is used to obtain different metrics from the schedule and to track time in Visual Studio Code. To be able to use it, you only have to create an account, where the data will be saved and consulted.

I use it to check my active scheduling time, my progress on this metric, daily scheduling time, and active scheduling percentage. Above all this you can also consult averages, and comparisons with the rest of the programmers.

I would show a capture with my own data, but it would not be a good demonstration since these weeks I have not worked with VSCode, and all the metrics would be at 0 🤣

In addition, this extension offers more functionalities and really useful integrations for programmers, such as report generation, team building, workspaces.

It is a very good option to improve productivity and know / improve our work habits, especially if we work from home, since in this circumstance it is very easy to work outside the ideal hours, or even more or less due time.

Path Intellisense

This extension performs the simple function of autocomplete file or folder paths.

As you can see, this extension doesn’t have much mystery, but it saves time, makes work easier, and improves the programming experience. Based on my experience and opinion, I think using this extension can be very convenient

GitLens

Obviously with GitLens you can perform any of the Git operations in a simple way and integrated into VSCode, but it is also an extension that increases and improves Git functions, and the workflow with this tool. It stands out for a very powerful graphical Git interface integrated in VSCode, which has a large number of functionalities, which by extension obviously I am not going to write here, but which can be consulted at https://gitlens.amod.io/#features

In my case, as a Git GUI tool I use SourceTree just out of habit, I don’t think it’s better or worse, I’ve just used it my whole life to perform Git functions. However, GitLens does have code comparison and history browsing capabilities that I use quite a bit. On the other hand, this extension integrates with the code editor to show information on the latest changes and when these changes have been made on it, even while we are writing the code. Without a doubt a good set of very powerful tools.

Noctis

This is a set of themes to visually customize the editor. I have chosen it because the colors are very attractive, and above all because it has a red color theme (Noctis Bordo) that is quite good for my eyes.

I decided to change because I noticed that lately the warm colors cause me less fatigue in the eyes, and with this theme I am quite happy due to the contrast between the colors, the warmth of it, and especially the visual aspect.

Shades of Purple

This is the theme I used before switching to Noctis, with bright colors that look great with the predominant purple of this theme, I think it is a more attractive theme than Noctis, due to the good color combination. In my opinion I think it has the best visual aspect of all the Visual Studio Code themes, it is really eye-catching, eye-catching, vibrant and colorful.

VSCode Great Icons

Finally, this extension modifies and adds a large number of icons to Visual Studio Code. It may seem something simply aesthetic, but it improves the user experience and makes it easier to identify the different elements in the sidebar, since it is very common to have a large number of files and folders of different types, where it can sometimes be really difficult to find what we are looking for. Also, with these icons the editor looks really good.

Well, I hope this post has helped you to somehow improve your experience when programming in Visual Studio Code 😃, because extensions are good tools to make your work easier and more productive, to customize any aspect of the editor and to add extra features.

--

--