はじめに

Using an AI agent?

Copy the instructions into your agent (Claude Code, Cursor, Codex, etc.) to set up a new docs site, or to add Fumadocs to an existing app. For other tasks, give it fumadocs.dev/llms.txt, which lists every docs page as Markdown.

Fumadocs (Foo-ma docs) は、高速かつ柔軟で、お使いの React フレームワークにシームレスに組み込めるよう設計されたドキュメントフレームワークです。複数のレイヤーで構成されています。

Fumadocs Core

ドキュメント検索、コンテンツソースのアダプター、Markdown 拡張機能など、ロジックの大部分を担います。

Fumadocs UI

Fumadocs のデフォルトテーマです。ドキュメントサイト向けの美しいデザインとインタラクティブなコンポーネントを提供します。

コンテンツソース

コンテンツの取得元です。CMS のほか、Fumadocs MDX(公式のコンテンツソース)のようなローカルデータレイヤーを利用できます。

Fumadocs CLI

UI コンポーネントのインストールや各種作業の自動化を行うコマンドラインツールです。レイアウトのカスタマイズに役立ちます。

さらに詳しく知りたい方へ

詳しい紹介記事「What is Fumadocs」をご覧ください。

フレームワークの選択

ガイドはフレームワークごとに用意されています。アプリで使用しているフレームワークを選択してください。新規プロジェクトの場合は Next.js をおすすめします。

Next.js（推奨）

高機能で成熟したフレームワークで、新規プロジェクトの標準的な選択肢です。

React Router

React Router アプリ向けです。SPA モードでは、サイトを CDN 上で静的にホスティングできます。

TanStack Start

TanStack Start アプリ向けです。SPA モードでは、サイトを CDN 上で静的にホスティングできます。

Waku

高速かつシンプルな、サーバーコンポーネントに対応した Vite ベースの React フレームワークです。

Astro

Astro サイト向けです。コンテンツコレクションを利用でき、MDX を React アイランドとしてレンダリングします。

よりシンプルな DX で Fumadocs を試す

Fumapress は、Fumadocs をベースに、より多くの機能を管理するサイトジェネレーターです。

自動ルーティング、llms.txt、MCP などの基本機能を備えています。
Vite (Waku) をベースにしています。

独自の React フレームワークの使用が前提となりますが、その分より優れた DX を提供します。