How to view the raw markdown of a dev.to post

Sometimes on dev.to, you might come across an article that uses some interesting markdown or liquid tags and wonder how it was created. Well, wonder no more!

dev.to is built on top of the forem software, which has a well-documented API. Each path is resolved relative to https://dev.to/api, so to get information about an article, all you need to do is add /api/articles in front of the pathname (username and slug).

For example, information about this article can be found here:
https://dev.to/api/articles/lionelrowe/how-to-view-the-raw-markdown-of-a-dev-to-post-391b

The raw markdown can be found under the body_markdown field.

Alternatively, here’s a browser console-friendly snippet:

;(async () => {
    const url = new URL(window.location)
    url.pathname = '/api/articles' + url.pathname

    const res = await fetch(url)
    const { body_markdown } = await res.json()

    console.log(body_markdown)
})()

Comments

[lionel-rowe]

One-liner version

console.log((await (await fetch(((url) => (Object.assign(url, { pathname: `/api/articles${url.pathname}` })))(new URL(window.location.href)).href)).json()).body_markdown)

[Farzad YZ]

Great post. thanks

[shapa]

Thank you so much, this is very useful