本文へスキップ

つくるフェーズ

  1. TOP
  2. Web制作
  3. つくるフェーズ
  4. ヘッドレスCMS

ヘッドレスCMS 更新性を保ちながら、表示と管理を分けるCMS構成を整理する。

ヘッドレスCMSとは、コンテンツを管理する機能と、Webサイトとして表示する機能を分離したCMSです。

CMSはコンテンツ管理を担当し、表示部分は別のシステムが担当します。Kuroco、microCMS、Contentfulなどが代表的なヘッドレスCMSとして利用されています。

Flying High Works(FHW)でも、Kurocoを利用したWebサイト構築を行っています。

ヘッドレスCMSとは

従来のCMSでは、コンテンツ管理、データ保存、画面表示を一つのシステムで行います。

例えばWordPressでは、管理画面、データベース、Webサイト表示が一つの構造の中にあります。

一方でヘッドレスCMSでは、CMSはコンテンツ管理のみを担当し、表示部分は別のシステムが担当します。

  • Kuroco
  • microCMS
  • Contentful

近年では、これらが代表的なヘッドレスCMSとして利用されています。

なぜヘッドレスCMSが増えているのか

従来のCMSでも、多くのWebサイトは問題なく構築できます。

ただし近年は、次のようなWebサイトやシステム連携が増えています。

  • 会員サイト
  • 検索サイト
  • ポータルサイト
  • 複数サービスとの連携

従来のCMSでも実現は可能ですが、システムが大きくなるにつれて、CMS側と表示側の責任範囲が曖昧になり、保守や拡張が難しくなるケースがあります。

そのため、CMSと表示部分を分離する構成が増えています。特に近年は、NuxtやNext.jsなどのフロントエンドフレームワークと組み合わせる構成が一般的になっています。

従来CMSとの違い

WordPressの場合、管理者、WordPress、DB、Webサイト、閲覧者という流れで構成されます。

一方でヘッドレスCMSでは、管理者、Kuroco、API、Nuxt、HTML生成、閲覧者という構成になります。

この構造の違いによって、CMSと表示部分をそれぞれ最適化しやすくなります。

また、Webサイトだけではなく、アプリ、社内システム、外部サービスなどからも同じデータを利用できるようになります。

ヘッドレスCMSとフロントエンド

ヘッドレスCMSでは、CMSがコンテンツ管理を担当し、表示部分は別のシステムが担当します。

そのため、次のような実装はフロントエンド側の役割になります。

  • ログイン状態による表示切り替え
  • 会員機能
  • 検索機能
  • マイページ
  • フォーム

特にKurocoのようなヘッドレスCMSは、API利用を前提として設計されています。

そのため、単純にCMSを導入するだけではなく、「取得したデータをどう表示するか」という設計も重要になります。

近年では、NuxtやNext.jsなどのフレームワークを利用することで、これらの機能を効率的に構築できるようになっています。ヘッドレスCMSでは、CMSの選定だけではなく、フロントエンドをどう構築するかも重要なテーマになります。

ヘッドレスCMSのメリット

APIを前提とした設計ができる

ヘッドレスCMSはAPI提供を前提としています。そのため、Webサイト、アプリ、社内システムなどで同じデータを利用できます。

表示部分を自由に構築できる

表示部分がCMSに依存しません。そのため、デザイン、UI、会員機能、検索機能などを柔軟に構築できます。

役割分担しやすい

編集担当者はCMSを利用し、エンジニアは表示部分を開発できます。運用と開発を分離しやすい構造になります。

会員サイトとの相性が良い

ヘッドレスCMSは、ログイン、マイページ、API連携などとの相性が良く、会員サイトやポータルサイトなどで利用しやすい構成です。

ヘッドレスCMSのデメリット

ヘッドレスCMSは万能ではありません。

例えば、次のような特徴があります。

  • APIの理解が必要
  • フロントエンド開発が必要
  • 初期構築コストが上がる場合がある

また、単純な企業サイトや更新頻度の低いサイトであれば、WordPressの方が適しているケースもあります。

そのため、ヘッドレスCMSありきで考えるのではなく、本当にその構成が必要かどうかを検討することが重要です。

Kurocoを利用する理由

私たちはヘッドレスCMS案件でKurocoを利用することがあります。

Kurocoは、コンテンツ管理、API管理、会員管理、認証機能などを備えています。

そのため、会員サイト、情報サイト、検索サイトなどで活用しやすいCMSです。

また、APIを中心とした設計になっているため、Nuxtとの組み合わせにも適しています。

WordPressとの違い

大きな違いは、設計思想です。

WordPressは、Webサイトを構築することを前提に発展してきました。

一方でKurocoなどのヘッドレスCMSは、最初からAPI利用を前提として設計されています。そのため、Webサイト、アプリ、外部サービスなどから同じデータを利用しやすい構造になっています。

実際、WordPress、REST API、Nuxtという構成も存在します。

ただし、KurocoなどのヘッドレスCMSは、最初からAPI提供を前提として設計されています。そのため、会員管理、認証、コンテンツ取得などの機能を利用しやすいという特徴があります。

Laravelとの違い

ヘッドレスCMSはLaravelの代替ではありません。

例えば、コンテンツ管理が中心であれば、KurocoやmicroCMSが向いています。

一方で、業務システム、独自管理画面、複雑な権限管理、独自の業務フローなどが必要な場合には、Laravelによるスクラッチ開発が適しているケースもあります。

実際には、ヘッドレスCMS、API、Laravelという組み合わせが採用されることもあります。

KurocoはCMSです。Laravelはフレームワークです。つまり、Kurocoはコンテンツ管理機能を提供するもの、Laravelは業務システムや独自機能を構築するためのもの、という違いがあります。

そのため、コンテンツ管理中心であればKuroco、独自の業務ロジックが中心であればLaravel、という考え方になります。

Flying High Worksの考え方

私たちはヘッドレスCMSを新しい技術だから採用するわけではありません。

大切なのは、更新体制、運用体制、API連携、会員機能、表示速度、将来の拡張性などを整理した上で、最適な構成を選択することです。

WordPressが向いている案件もあります。Laravelが向いている案件もあります。ヘッドレスCMSが向いている案件もあります。

私たちは技術そのものではなく、「どの構成が将来にわたって運用しやすいか」という視点で設計を行っています。

ヘッドレスCMS案件に取り組む中で、CMS、API、フロントエンドをそれぞれ独立して考える必要性を感じてきました。その結果、CMSだけを見るのではなく、表示部分、会員機能、検索機能、運用体制まで含めて構成を考えるようになっています。