静的サイトを生成する
「ブログや資料サイトを作りたい」
この目的で選ぶときに見る軸
- ビルド時間
- コンテンツ形式
- 動的要素の追加方法
下の表の「主要制約」は各ツールで最も先に当たる制約。軸ごとの値はツール詳細の制約表で確認する。
この目的に使える手段（4件）
| ツール | 分類 | 種別 | 学習 | 料金 | 成熟 | 主要制約 | 検証 |
|---|---|---|---|---|---|---|---|
| Astro 既定でJavaScriptを出さない静的サイト生成器。必要な部分だけ島として動かす | 画面・フロントエンド | フレームワーク | 低 | 無料 | 安定 | 島（Island）の間の状態共有：部分ハイドレーションされた島の間では React Context 等のコンテキストラッパーが使えない。共有には Nano Stores（1 KB 未満、依存なし）のような外部ストアが推奨される | |
| Notion ドキュメント・DB・Wikiを1つにまとめ、Webサイトとしても公開できるツール | ノーコード・SaaS | マネージドサービス | 低 | 無料枠あり | 安定 | 無料プランのブロック数上限：オーナー1人のワークスペースは無制限。オーナー2人以上は1,000ブロックまで（削除してもカウントは減らず、上限到達後3日間の猶予がある） | |
| SvelteKit Svelteでルーティング・サーバー処理・静的出力までを完結させるフレームワーク | 画面・フロントエンド | フレームワーク | 中 | 無料 | 安定 | デプロイ先ごとのアダプタ選定：ビルド出力をデプロイ環境向けに変換する「アダプタ」の指定がsvelte.config.jsで必須。公式にNode・Cloudflare・Netlify・Vercel・静的サイト(adapter-static)向けがある | |
| Next.js Reactにルーティング・サーバー描画・APIを足した、Web アプリのフレームワーク | 画面・フロントエンド | フレームワーク | 高 | 無料 | 安定 | 静的エクスポートで使えない機能：output を export にすると Cookie、Rewrites・Redirects・Headers、Proxy、ISR、既定ローダーの画像最適化、Draft Mode、Server Actions、Intercepting Routes、generateStaticParams のない動的ルートが使えない。Route Handler は GET のみ、force-static の明示が必要 |