MDXとは

MDXは、Markdown記法の中でJSX（JavaScriptのコンポーネント）を直接記述できるフォーマットです。

通常のMarkdownでは静的なテキストしか書けませんが、MDXを使うことで、Reactコンポーネントをドキュメント内に埋め込むことができます。

主な特徴

• Markdownとの互換性: 通常のMarkdown記法がそのまま使える
• コンポーネントの利用: ReactやAstroなどのコンポーネントを直接埋め込める
• 動的なコンテンツ: JavaScriptの変数や関数を使った動的な表示が可能

使い方

MDXファイルでは、以下のようにコンポーネントを使用できます：

import MyComponent from './MyComponent';

# 見出し

通常のMarkdownテキスト。

<MyComponent prop="value" />

さらにMarkdownが続く。

AstroでのMDX

Astroでは@astrojs/mdxインテグレーションを使うことで、MDXをサポートできます。