# MDX: Markdown for the component era 
MDX (opens new window) is an authorable format that lets you seamlessly write JSX in your markdown documents. You can import components, such as interactive charts or alerts, and embed them within your content. This makes writing long-form content with components a blast. 🚀
import {Chart} from './snowfall.js'
export const year = 2013
# Last year’s snowfall
In {year}, the snowfall was above average.
It was followed by a warm spring which caused
flood conditions in many of the nearby rivers.
<Chart year={year} color="#fcb32c" />
1
2
3
4
5
6
7
8
9
10
2
3
4
5
6
7
8
9
10
See section Snowfall component example (opens new window) in the teacher's PL notes. Source code (opens new window)
See § What is MDX (opens new window) for more info on the format. See § Playground (opens new window) to try it out.