Quick Tip: How to Enable Syntax Highlighting on Dev.to

I recently wrote this in response to another post here.

Most of you probably already are taking advantage of this, but I thought it might help someone, so here we are.

Consider specifying the language in your markdown code blocks because Dev.to has syntax highlighting!

You can do this by adding the language after the first three backticks at the start of your code block.

This text (in the Dev.to editor)...

...produces a code block with highlighting:

const fn = () => {
  const x = "hello"
  return 3 + x
}

Without the js after the backticks, you get non-highlighted code:

const fn = () => {
  const x = "hello"
  return 3 + x
}

It works with a LOT of different languages, not just JavaScript!

The parser unfortunately makes it difficult to explain, but hopefully, the picture is clear enough!