My Top Ten Visual Studio Code Extensions 2020
My list of VS Code extensions I use in my daily development workflow.
I’ll detail the package name to search for in the VS Code extensions tab.
In no particular order…
Really useful for getting file names in code, I use it all the time for images in Markdown files.
christian-kohler.path-intellisense in the VS Code
Great Git integration that let’s you quickly view a files git history in the editor.
eamodio.gitlens in the VS Code extensions tab.
The invisible formatting deity that rewards us for not writing incorrect code by formatting with ease and grace.
Be sure not to anger Prettier or your code will remain unbearable to read.
esbenp.prettier-vscode in the VS Code extensions tab.
Auto Close Tag / Auto Rename Tag
Two extensions, that should be one that do a great job of adding closing tags for your html and jsx.
formulahendry.auto-rename-tag in the VS Code extensions tab.
This is really handy as I use styled components a lot and it gives syntax highlighting and IntelliSense for styled-components.
jpoissonnier.vscode-styled-components in the VS Code
Code Spell Checker
This! Without this my Markdown would be very painful to read, there are other spell check extensions out there but I have found this one by far the most straightforward to set up and get going with.
To correct a spelling you’ll get the squiggly line warning, put the cursor on the word and use Ctrl+. to get the correction suggestions.
streetsidesoftware.code-spell-checker in the VS Code
Another syntax highlighting extension this time for MDX with bracket matching for MDX (JSX in Markdown).
silvenon.mdx in the VS Code extensions tab.
Code Time is a great way for you to visualise time spent on projects with a detailed summaries of projects and time spent on each.
softwaredotcom.swdc-vscode in the VS Code extensions tab.
Much the same as Code Time with a premium tier that offers unlimited dashboard history and the ability to export your coding activity.
WakaTime.vscode-wakatime in the VS Code extensions tab.
This will display the colour of hex codes in you code. nice to have.
naumovs.color-highlight in the VS Code extensions tab.
A beautiful, accessible, understated theme for VS Code.
sdras.night-owl in the VS Code extensions tab.
Another really nice fully featured theme with italics!
josef.rouge-theme in the VS Code extensions tab.
Another syntax highlighting extension, this time for
mikestead.dotenv in the VS Code extensions tab.
Material Icon Theme
A massive fully featured icon set for VS Code, still the only one I have found that shows the Gatsby config and Vercel now.json files with their own icon.
PKief.material-icon-theme in the VS Code extensions tab.
Visual Studio IntelliCode
IntelliSense code completion for some parts of my workflow, if I used TypeScript more this would probably be a really useful extension.
VisualStudioExptTeam.vscodeintellicode in the VS Code
Year to date analytics for this post