Using MDX

This article also exists in: French

Hello, world!

Thanks to MDX, It is now possible to add JSX in Markdown! Below is an example of JSX embedded in Markdown.

MDX 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 🚀.

Example:

This is JSX in Markdown

Code:

<div style={{ padding: '20px', backgroundColor: 'tomato' }}>
  <h3>This is JSX in Markdown</h3>
  {console.log('hello MDX')}
</div>

How-to?

import MySuperComponent from '../path/to/MySuperComponent'

# Some text in Markdown

<MySuperComponent />
other text in markdown

Read more

👉 https://mdxjs.com

About the author

崇尚新潮技術的自學者,對世界的運作充滿好奇,
導致各種IT相關技術都有所涉略(Web🌎| Mobile📱| Desktop💻| Game🎮)
日後將發布各種小知識與技術細節的文章,歡迎聯繫與討論😉