DEV Community

Warren Wong
Warren Wong

Posted on • Originally published at warrenwong.org on

Ten* VS Code Plugins for a "Productive" Developer

Originally published on warrenwong.org.

There are some obvious caveats to this list. This is a list for my workflow. I work mostly in TypeScript and React, but also do some work with data in Python. YMMV.

Apollo GraphQL or GraphQL

I was able to get GraphQL highlighting to work on TypeScript with the Prisma plugin but not the Apollo plugin at one point. I'm not so sure if it's all good right now since I'm too lazy to remove one and check. I think they both work now so these plugins maybe redundant. Oh well.

Auto Complete Tag

This plugin supposedly combines the functionality of Auto Close Tag and Auto Rename Tag but I haven't got it to work with JSX. It does seem to work if you install all three of these plugins together, or just Auto Rename and Auto Complete together. One annoyance when working with TypeScript is that the plugin doesn't know the difference between JSX and a TypeScript Type Assertion. VS Code comes with autocomplete closing tags out of the box for html and some other template files, but these plugins are still necessary for JSX files.

*You can count this as one plugin or three.

Cobalt2 Theme Official

This theme is like Solarized Dark, but better. I've heard that the Material UI themes are pretty popular and I may give them a try if I get tired of this theme, but I've been rocking this one for a while and it's been pretty easy on my eyes.

Debugger for Chrome

I'll have to be honest, I don't use this much. I just console.log a lot like all the other degenerates. This is more an aspirational entry into this list.

GitLens

It took a little bit to get used to, but I find this plugin invaluable now. I mostly don't notice the commit info unless I need it. And when I need it, it's right there.

Markdown All in One

I write my blog posts with Markdown, but that's not why this plugin is so useful. While I used to write notes in Org Mode in Emacs, VS Code has become my daily driver and I've pretty much switched over to note-taking in Markdown as well. This plugin helps keep the md file nice and formatted.

Markdown Preview

What can I say? It's nice to look at a rendered Markdown file side-by-side while typing. This is incredibly helpful when writing some LaTeX.

Prettier - Code formatter

In the past, I had prettier format my code in a pre-commit hook, but that's not really all that satisfying. I make sure to have VS Code format-on-save. If you work on a larger team, it's pretty important to make sure everyone also uses Prettier to keep the code base formatting consistent. It saves on the a lot of time-wasting code reviews about code formatting as well.

Python

The Python support has gotten really good on VS Code.

Rainbow CSV

If you look at a lot of CSVs, this plugin is really helpful. Every column is a different color. There's also a plugin that I use to render Excel files if you have to work with those.

Top comments (0)