Next.js

かんたんに言うと

Next.js は React の上に作られた「フルスタックフレームワーク」です。React が用意してくれるのは画面のコンポーネントだけ。Next.js はそこに、完成したサイトに必要なものをひととおり内蔵します。ルーティング、サーバーサイドレンダリング（SSR）、静的書き出し（SSG）、API ルートまで、箱から出してすぐ使える状態です。

最大の価値のひとつが SEO に強い こと。サーバー側やビルド時にあらかじめ HTML を生成できるので、検索エンジンがらくにクロールできます。このサイト自身も Next.js の静的書き出しモードを使い、Cloudflare Pages にデプロイしています。React のエコシステムで本物のサイトを作るなら、Next.js はほとんど既定の選択肢です。

アーキテクチャ

動作の流れ

SSR か SSG か：どちらを選ぶ

Next.js はページを 2 通りの方法で作れます。選び方は結局ひとつの問いに行き着きます。みんなが同じページを見るのか、それとも訪問者ごとに違うものを見るのか。

• SSG（静的） — ページは前もって一度だけ作られ、全員に同じ HTML が配られます。コンテンツやマーケティングのページ、ドキュメント、ブログ（このサイトのような）に最適です。
• SSR（サーバーレンダリング） — リクエストのたびに新しくページを作ります。ログイン後のダッシュボードやリアルタイムの価格のように、HTML を一人ひとり向けに、あるいは秒単位で最新にしなければならないときに選びます。

便利な原則：まず SSG から始めて、「これは全員に同じではありえない」という本当の理由が見つかったときだけ、そのページを SSR に切り替えること。

まとめ

• Next.js ＝ React のフルスタックフレームワーク。箱から出してすぐ使える。
• SSR / SSG を内蔵し、SEO に強い — このサイトもこれを使用。
• 概念は多めだが、エコシステムと AI のサポートが強力。