MDX - Markdown for the component era

MDX allows you to use JSX directly within your markdown content. This means you can import JSX components and seamlessly embed them in your text. This makes writing long-form content with dynamic components much more enjoyable and efficient. Markdown often feels more natural to write than HTML or JSX, especially for common elements like emphasis or headings.

Accessing props in MDX

The current url is /mdx. In MDX all props can be accessed via props.

Hello Jeasx

The content above rendered via a MDX component

Dynamic content in MDX

• Classic Margherita Pizza
• Vegetarian Stir-Fry
• Chocolate Chip Cookies
• Chicken Alfredo Pasta
• Mango Salsa Chicken

GitHub-Markdown

Jeasx supports plain MDX by default, but you can enable GitHub-Markdown via plugins.

• [ ] to do
• [x] done

| a | b | c | d | | - | :- | -: | :-: |

~one~ or ~~two~~ tildes.

www.example.com

How to enable MDX plugins via .env.js?

import remarkGFM from "remark-gfm";

export default {
  /** @type import("@mdx-js/esbuild").Options */
  ESBUILD_MDX_OPTIONS: {
    remarkPlugins: [[remarkGFM, { singleTilde: false }]],
  }
};