はじめに
Webサイトを制作する際、最初に悩むポイントのひとつが「どのフレームワークやCMSを選ぶか」という点です。
学習を始めた頃は知名度だけで選んでしまいがちですが、目的に合わない仕組みを選ぶと表示速度が落ちたり、公開後の保守負担が増えたりすることがあります。
本記事では、配信方式の基本をおさらいした上で、代表的な3つの選択肢（WordPress・Next.js・Astro）の特徴と選び方の基準をまとめます。
1. 「動的生成」と「静的サイト生成」の違い
WebサーバーがブラウザにHTMLを届ける仕組みには、大きく分けて2つの方式があります。
flowchart TD
subgraph Dynamic["① 動的生成 (CMS / SSR)"]
U1["訪問者のアクセス"] --> S1["サーバーが毎回プログラムを実行"]
S1 --> DB1["DBから記事を取得しHTMLを返却"]
end
subgraph Static["② 静的サイト生成 (SSG)"]
B2["ビルド時"] --> G2["あらかじめ全ページのHTMLを作成"]
U2["訪問者のアクセス"] --> CDN["完成済みのHTMLをそのまま配信"]
G2 --> CDN
end- 動的生成（CMS / SSR）: アクセスごとにサーバーでプログラムが動き、DBから情報を取得してHTMLを組み立てる方式です。ログイン機能や在庫表示など、人によって表示が変わるサイトに向いています。
- 静的サイト生成（SSG）: 公開前（ビルド時）に全ページをHTMLとして出力しておく方式です。完成済みのファイルを届けるだけなので表示が速く、本番環境でDBを常時動かさずに済むため保守負担を抑えられます。
2. WordPress・Next.js・Astro の比較
よく比較される3つの技術の特徴を以下の表に整理しました。
| 技術名 | 主な仕組み | 得意な用途 | 注意点・保守面での特徴 |
|---|---|---|---|
| WordPress (PHP) | 動的生成（CMS） | 非エンジニアを含む複数人で、管理画面から頻繁に記事を更新するサイトに向いています。 | PHPやプラグインの定期的なアップデートやセキュリティ管理の手間がかかります。 |
| Next.js (React) | 動的生成（SSR）＋SSG | 認証やダッシュボードなど、複雑な状態管理を行うWebアプリに向いています。 | 閲覧中心のサイトでは配信されるJavaScript量が多くなりやすく、機能が過剰になることがあります。 |
| Astro | 静的生成（SSG）中心 | ポートフォリオや企業サイトなど、記事や実績を快適に読んでもらうサイトに向いています。 | 標準で余分なJavaScriptを送らない（Zero-JS）ため軽く、必要な箇所だけReact等を組み込めます。 |
3. 目的と「将来の運用負担」から逆算する
技術選定では「何ができるか」だけでなく、「今回のサイトに何が不要で、公開後にどんな管理負担が発生するか」 から逆算すると整理しやすくなります。
- 管理画面が必要か: 非エンジニアの方が管理画面から投稿するなら WordPress 等が候補になりますが、開発者自身がMarkdown（MDX）で記事を書きGit管理できるなら、DBを持たない構成の方が安全に運用できます。
- 動的な機能はどれくらいあるか: サイト全体がWebアプリなら Next.js が適していますが、「基本は閲覧のみで、お問い合わせフォームだけ動けばよい」場合は、静的配信（Astro）＋小さなAPI関数の組み合わせにすると全体をシンプルに保てます。
まとめ
フレームワーク選びでは、「動的生成と静的生成の違い」を理解し、用途や公開後の保守コストに照らし合わせて選ぶことの大切さを学びました。
なお、この考え方をもとに Astro を採用して構築した当サイトの全体像については、制作実績の 型安全性と軽量化を意識した就職活動用ポートフォリオサイト にまとめています。