Docusaurusからの移行

DocusaurusはReact製の人気ドキュメントサイトビルダーです。

DocusaurusとAstroの類似点

DocusaurusとAstroには、プロジェクト移行を容易にするいくつかの共通点があります。

どちらもJavaScriptベースのモダンなサイトビルダー（Jamstack）であり、コンテンツ駆動なウェブサイト―とくにドキュメントサイト―を構築するために最適化されています。
両者ともMDXページ (EN)をサポートしています。既存の.mdxファイルをAstroに持ち込んでそのまま使用できます。
どちらもsrc/pages内に置いたMDXファイルに対してファイルベースルーティング (EN)を行い、自動でページルートを生成します。既存コンテンツや新規ページをAstroのディレクトリ構造に配置しても違和感は少ないでしょう。
AstroにはReactコンポーネントを利用する公式インテグレーション (EN)があります。AstroではReactファイルの拡張子を.jsxまたは.tsxにする必要があります。
AstroはNPMパッケージのインストール (EN)をサポートしており、多くのReact用パッケージもそのまま利用できます。既存のReactコンポーネントや依存関係をそのまま移行できる可能性もあります。
AstroのJSXライクな構文はReactに慣れていればすぐ理解できます。

DocusaurusサイトをAstroで再構築すると、次のような違いに気付くでしょう。

DocusaurusはReactベースのシングルページアプリ(SPA)ですが、Astroサイトは.astroコンポーネントで構成されたマルチページアプリです。必要に応じてReact、Preact、Vue.js、Svelte、SolidJS、AlpineJSを併用できるほか、生のHTMLテンプレートもサポートされます。
Docusaurusにはドキュメントサイト向けの機能が組み込まれています。Astroではこれらを自前で実装するか、公式ドキュメントテーマStarlightやコミュニティ製ドキュメントテーマを利用します。なお、Starlightは当サイト（Astro本家サイト）を元に開発されており、現在この公式サイトもStarlightを使って動作しています。
DocusaurusはコンテンツをMDXで管理しますが、StarlightはデフォルトでMarkdown(.md)を使い、MDXはオプションです。必要であればAstroのMDXインテグレーションを追加して.mdxを併用できます。（Starlightには標準で含まれています。）

DocusaurusドキュメントサイトをAstroへ移行するには、まずStarlight公式スターターテンプレートを使用するか、テーマショーケースでコミュニティ製ドキュメントテーマを探索してください。

create astroコマンドに--templateを渡すと、公式スターターで新しいAstroプロジェクトを作成できます。また、GitHub上の既存Astroリポジトリから新規プロジェクトを開始することも可能です。

npm create astro@latest -- --template starlight

pnpm create astro@latest --template starlight

yarn create astro --template starlight

AstroのMDXインテグレーションはデフォルトで含まれているため、既存のコンテンツファイルを直ちに追加できます。

公式スターターおよび他のテンプレートはastro.newで確認できます。各プロジェクトのGitHubリポジトリ、IDX・StackBlitz・CodeSandbox・Gitpodで開くワンクリックリンクも用意されています。