Chapter 14

Headless CMS

前ページまでの内容でアプリケーションの大枠ができてきました。ここからはデータの連携方法について学んでいきます。
今回扱うデータはすべてHeadless CMSと呼ばれるシステム内に保存されます。
headless-cms.png

CMSとは

Headless CMSの説明の前に、そもそもCMSとは何かについて理解しておきましょう。
CMSとは、Contents Management Systemの略語で、HTMLやCSSを書かずともWebページを作成、管理、表示できるツールのことです。CMSの代表例として挙げられるのはWordPressです。

ブログなど投稿頻度の多いコンテンツを扱うサイトで、投稿のたびにHTMLやCSSを書いてページを作成するのは非常に手間がかかります。CMSを使う場合には、専用の投稿ページとエディタが用意されておりHTMLやCSSを書かずともお手軽にページを作成できます。
また、下書きや予約投稿などの機能提供されており、コンテンツ作成時に便利です。

Headless CMSとは

CMSではコンテンツの管理とそのコンテンツの表示画面の生成を行います。
一方、Headless CMSはコンテンツの管理のみを行います。つまり、CMSから表示画面を取り除いたものと言えるでしょう。

近年ブラウザ(PC・スマホ)、アプリ、ウェアラブルデバイスなど様々な媒体からコンテンツが見られる機会が増えました。そのため、媒体に合わせた表示画面を作っていく必要があります。
例えば、PCやスマホブラウザでは表示画面を作成するフロントエンドのサーバーが必要ですが、アプリやウェアラブルデバイスなどはネィティブアプリ内であらかじめ画面を作成するためフロントエンドのサーバーの必要はなく、コンテンツのデータのみ取得する必要があります。
このようにコンテンツの管理と表示でシステムを分けるという需要からHeadless CMSが注目を増しつつあります。

Contentful

本書では「Contentful」をHeadless CMSとして利用します。Contentfulはドイツの会社が提供しているサービスでGatsbyとの相性が良く、Gatsby + Contentfulでサイトを作るという事例も増えています。
利用料金に関しては無料枠があり手軽に始められ、データ量などの使用量が増える場合は有料のプランで使っていくことになります。今回作成するブログにおいては、無料枠で十分収まる範囲です。
また、柔軟にデータを定義できたり、webhookを用いてデータの更新をトリガに処理を行えたりと機能面でも充実しています。

次のページから実際にContentfulに登録を行い、データ連携を行っていきましょう。