Community / About
This article explains in short how MDX came to be and why it exists. It also gives thanks to the people who’ve helped make it and inspired it.
MDX is the combination of markdown with JSX. See § What is MDX? for more info.
Markdown does not have a syntax for custom components. MDX solves this.
There are many languages objectively better than markdown, however, markdown is great because:
Markdown does have a way to extend it, HTML, but that has drawbacks:
markdown="1"
attributesThe frontend world has an alternative to HTML: JSX. JSX is great, amongst other things, because:
The project is governed by the unified collective.
The idea of combining markdown, JavaScript, and JSX was a collaborative effort by Guillermo Rauch (@rauchg), James K. Nelson (@jamesknelson), John Otander (@johno), Tim Neutkens (@timneutkens), Brent Jackson (@jxnblk), Jessica Stokes (@ticky), and more.
While everyone above was key to MDX, we want to stress the involvement of John Otander (@johno). John wrote most of the code for the first alpha and later stable version 1 of this project!
Logo designs were created by Evil Rabbit of Vercel.
The following projects, languages, and articles helped shape MDX either in implementation or inspiration.
The markdown and JSX languages inspired MDX. Markdown was created by John Gruber (@gruber). CommonMark, the most popular markdown variant, by John McFarlane (@jgm) et al. JSX was created by Sebastian Markbåge (@sebmarkbage) et al. at Facebook, Inc.
The @mdx-js/*
projects currently make heavy use of unified (specifically micromark, remark and rehype) and Acorn. unified, remark, rehype, and related tools were created by Titus Wormer (@wooorm) et al. Acorn by Marijn Haverbeke (@marijnh) et al.
The following projects inspired @mdx-js/*
originally:
jamesknelson/mdxc
ticky/markdown-component-loader
threepointone/markdown-in-js
fazouane-marouane/remark-jsx
mapbox/remark-react
rx-ts/eslint-mdx
The following articles inspired @mdx-js/*
originally: