DEV Community

loading...
Cover image for 10 Must-Have VS Code Extensions to Improve Your Productivity

10 Must-Have VS Code Extensions to Improve Your Productivity

Alex Omeyer
Co-founder & CEO at Stepsize, SaaS to measure & manage technical debt
Updated on ・3 min read

I asked developers in my team what VS Code extensions they use to boost their productivity, and here’s what they said.

1. Live Server

Live Server allows you to see code changes reflected in the browser. It launches a local development server with a live reload feature both for static and dynamic pages.

Every time you save your code, you'll instantly see the changes reflected in the browser. You'll be much faster at spotting errors and it's much easier to do some quick experiments with your code.

Alt Text

2. Remote - SSH

The Remote - SSH extension lets you use any remote machine with an SSH server as your development environment. This makes it much easier to develop and/or troubleshoot in a wide variety of scenarios.

You also don’t need any source code on your local machine, because the extension runs commands and other extensions directly on the remote machine.

Alt Text

3. Stepsize

Sometimes you come across technical debt or other technical issues that should be fixed. You might not have time to fix it right away but you want to make it visible and raise an issue.

Stepsize allows you to bookmark code, track technical debt directly from the editor, and create TODOs.

It also allows you to collaborate with your teammates on maintenance and refactoring work.

Alt Text

4. Prettier

The Prettier extension helps code look better and be more consistent. It enforces a consistent style by parsing your code and reprinting it with its own rules that take the maximum line length into account, wrapping code when necessary.

Alt Text

5. WakaTime

WakaTime allows you to see metrics, insights, and time tracking automatically generated from your programming activity.

You will learn exactly how long you spend coding as it automatically tracks when you start and stop typing, with detailed metrics for projects, file, branch, commit/PR, feature, and more.

Alt Text

6. Code Spell Checker

The goal of this spell checker is to help you catch common spelling errors while keeping the number of false positives low. It shows misspelled words that are technical terms or variables within comments and strings.

Alt Text

7. Compareit

Compareit extension helps you compare two files which you can choose from your current project and other directory on your computer or clipboard.

Alt Text

8. GitLens

GitLens helps you better understand code in a glimpse by visualizing code authorship via Git blame annotations and code lens, seamlessly navigate and explore Git repositories, gain valuable insights via powerful comparison commands, and more.

Alt Text

9. Remote - Containers

The Remote - Containers extension lets you use a Docker container as a full-featured development environment. Containers make a great development environment because you can develop with a consistent reproducible toolchain on the same operating system you deploy to and quickly swap between different, separate development environments, safely make updates, and more.

Alt Text

10. Quokka.js

Quokka.js is a developer productivity tool for rapid JavaScript / TypeScript prototyping. Runtime values are updated and displayed in your IDE next to your code, as you type. It makes prototyping, learning, and testing JavaScript / TypeScript much faster.

Alt Text

Discussion (10)

Collapse
ramnikov profile image
Andrey Ramnikov

Stepsize sounds interesting… I am always looking for a good tool on Mac to write some notes and documentation

Collapse
drsimplegraffiti profile image
Abayomi Ogunnusi

I heard tabnine is actually good too

Collapse
wsbrendonballantyne profile image
WSBrendonBallantyne

I've used tabnine for a month so far and it's been pretty helpful. It's suggestions have been accurate maybe about 60% of the time, and that's excellent for me.

Collapse
drsimplegraffiti profile image
Abayomi Ogunnusi

Thanks for the feedback....I will give it a shot

Collapse
silentdev profile image
Ezekiel Lawson

Tabnine is is not just a tool It is a great experience. If you use one of the supported editors, I would recommend all developers try out TabNine for JavaScript or any other language you might write in your editor.

Collapse
nothingbutcoding profile image
Ash

Great article, I'm definitely going to try out WakaTime and Stepsize, thank you.

Collapse
ayonbit profile image
Ayon Bit

Thanks for sharing this

Collapse
adampatterson profile image
Adam Patterson

AI love the idea of VSCode and how vibrant the community is but I personally find it hard to work with PHP compared to PHP Storm.

StepSize sounds really interesting.

Collapse
harshitaditya1 profile image
Harshit Aditya

Wakatime and stepsize looks amazing.

Collapse
dima2306 profile image
Dimitri

This extension is also worth checking: Blockman