When I started writing this weekly blog on dev.to, like 3 months ago, I didn’t know what tools to use, so I just turned to the one I use and like the most these days: VSCode.

Since then, I’ve been customizing my blogging workspace to include all the tools I need to write my articles fast and comfortably in VSCode and then copy-paste them to DEV.

In this article, I’ll show you the extensions and tools I use to write DEV articles in VSCode:

1. Markdown extension

I use an extension called Markdown all in one that adds markdown support to VSCode.

One of its most powerful features is auto-preview, which allows us to write markdown and preview it on the side:

VSCode screenshot with the editor split in two. Markdown code on the left and preview on the right

This extension includes other cool features, for example, you can automatically create a table of contents, and also use shortcuts like Ctrl + B to toggle bold text.

2. Spell checker extension

To keep my writing free of spelling mistakes I installed Code spell checker. This extension catches common spelling errors and gives you suggestions to fix them by pressing Ctrl + . over the misspelled word.

Pro tip: This extension is also useful to avoid spelling mistakes when you’re coding at the speed of light 😂

3. Emoji extension 😉

I like to add emojis to my articles every now and then, and this extension is great for that: :emojisense:.

Just write : and start writing the name of the emoji and the extension will display emoji options like so:

4. Git

I sometimes write my articles from different devices. Maybe I start working on my laptop and then finish the article on my desktop PC. That’s why I use git to keep my work synced on all my devices within a Blog repo that contains all of my articles and even cover images and other resources.

5. VSCode workspaces

Extensions can be enabled for a specific workspace if you don’t need them all the time. I created a Blogging workspace in VSCode to setup extensions that I will only use on my articles. For example, I don’t normally use emojis while coding, so I disabled that extension for every other workspace:

Screenshot of VSCode "enable extension" menu with the "Enable (Workspace)" option selected)

Thoughts? 💬

Was this post useful? What tools do you use for your DEV articles?

This post is also available on DEV.