VSCode Extensions for Productivity

VSCode is one of the most popular code editors these days, offering multiple language support and the ability to transform into a full fledged interactive development environment (IDE) by using extensions. Here are a few extensions that will likely boost your productivity when using VSCode:

GitHub Copilot

GitHub Copilot has been a phenomenal addition to the VSCode extension ecosystem, owing to its ability to generate boilerplate code in multiple programming languages. Even though it is not as good (yet) in generating 100% correct code all the time, it can, for example, generate tests for your existing code with fairly decent accuracy.

Git Graph

After you have implemented parts of your next big feature, the next step usually is to make a commit to your version control system to help save your progress. The Git CLI is great, but isn’t the most helpful if you want a visually intuitive view of your commits. Git Graph is a tool that helps you visually see all the branches in your repository, view their collective history, see diffs of your changes, quickly checkout to a branch, and has many more helpful features.

Code Spell Checker

If you’re poor at identifying spelling mistakes and controlling your keystrokes, like me, you probably often write “vallue” instead of “value” and “repoistory” instead of “repository”. This particular extension will help you avoid these mistakes that might just be identified in PR reviews and making you undergo imposter syndrome.

Error Lens

Error Lens is a nice extension that displays all the current syntactical errors, spelling and linting warnings right in your code editor with varying colors depending on the type of error. The errors stay until you fix them (or you can always close the file and pretend they don’t exist), which makes it easier to spot and fix them, as opposed to navigating to the Problems panel.

JSON to TS

This extension applies to TypeScript users, and allows creation of types from JSON objects, which is immensely helpful in rapidly generating types without any manual labour required. It supports nested objects as well.

Regex Previewer

Whenever you’re working with regular expressions (regex), it’s always helpful to have a set of strings to test the regex with so that you can be sure it matches with only the set of strings that you intend it to. Regex Previewer is a handy extension that shows previews of the matches of a given regex in a separate tab opened inside VSCode.

Thunder Client

If you want to quickly test out an API endpoint from right within your code editor, Thunder Client is a great option for VSCode users. It supports a large set of features from its alternative Postman, including Collections and environment-based configurations.

That concludes the list of the VSCode extensions that I personally recommend! There are thousands of extensions available in the VSCode Extensions Marketplace, each of which has the ability to uniquely transform your code editor experience.