WordPressを愛する私が、ヘッドレスCMSに惹かれてAstroを試してみた話

私はこれまで、Web制作の現場でWordPress（以下、WP）を多く扱ってきました。WPは世界的なシェアを誇るCMSで、豊富なプラグイン、テーマ、そして圧倒的な情報量がそろっており、「CMSといえばこれ」といっても過言ではありません。実際、個人でも業務でもずっとお世話になってきましたし、今でもその完成度の高さにはリスペクトしかありません。

そんな私が、ある日ふと耳にしたのが「ヘッドレスCMS」というキーワードでした。調べてみると、最近はmicroCMSやContentfulといったAPIベースのCMSが登場し、フロントエンドとバックエンドを疎結合にするアーキテクチャが注目されているとのこと。静的サイトジェネレータやJamstackという言葉もよく目にするようになり、興味が湧いてきました。

特に私が気になったのは、「フロントエンドをReactなどのモダンな技術で柔軟に構築できる」という点です。WPはPHPベースで動いており、どうしてもフロント実装もPHPに引っ張られてしまいます。しかし最近では、shadcn/uiのような高品質なUIコンポーネントがReactで扱えたりしています。CSR（クライアントサイドレンダリング）やSSR（サーバーサイドレンダリング）などを意識したパフォーマンスチューニングも場合によっては必要になってきます。

「だったら、フロントはReactで組んで、CMSはAPIでデータを受け取るだけにできたら最強なのでは？」

そんなモチベーションで試してみたのが、Astro × microCMS の構成でした。

実際にAstroとmicroCMSを使って構築してみたコードの一部は以下の通りです：

const blog = await getBlogDetail(blogId as string);

<Layout title=”Blog Detail”>

  <main>

    <h1>{blog.title}</h1>

    <p>公開日時：{new Date(blog.publishedAt).toLocaleString()}</p>

    <div set:html={blog.content} />

  </main>

</Layout>

このように、microCMSで登録した記事をAPI経由で取得し、Astroのコンポーネントで描画するという構成が、驚くほどすっきりと実現できました。

ただし、ここでふと疑問に感じたのが、「これ、便利なのに、なぜ実案件ではあまり見かけないんだろう？」ということ。そこで改めて振り返ってみたところ、いくつかの仮説が浮かびました。

■ なぜ普及していない？私なりの考察

まず大きいのは、従来のCMS（とくにWP）の完成度が高すぎるという点です。企業のWebサイトやブログといった用途であれば、WPを導入し、テーマをカスタマイズすれば「見た目・機能・管理画面」の全てがすぐに整ってしまう。しかも、非エンジニアの担当者でもある程度扱えるという安心感もある。

また、ヘッドレスCMSを導入するということは、「APIでのデータ取得」「フロント実装の自由度と責任」が生まれるということでもあります。これは、ReactやNext.jsのようなフレームワークにある程度慣れていないと、運用が難しくなる可能性もあることを表します。

さらに、ヘッドレスCMSを活かせるのは「フロントエンドの表現力が求められるようなケース」に限られることが多い印象です。ブログやコーポレートサイトのような一般的な用途であれば、WPだけで完結してしまうのも事実です。

■ それでも「武器」として持っておきたい

実際にAstroを触ってみて思ったのは、「これはこれで、かなり良い！」という感想です。

小〜中規模のプロジェクトや、技術的チャレンジを許容できる案件であれば、モダンな構成として採用する価値は十分あります。

Reactエンジニアの視点から見れば、UI構築を自由に行えるのはやはり魅力的ですし、APIさえ整えばバックエンドの構成をシンプルに保てるのもヘッドレスの強みです。

最後に

WPのような「完成されたCMS」と、AstroやmicroCMSのような「自由な構成が可能なヘッドレスCMS」。

どちらも素晴らしい選択肢であり、「どちらが優れているか」ではなく「どのような目的・体制・スキルセットで、どちらが最適か」を見極めていくことが、これからの開発には大切なのだと実感しました。