Cntlog

これから始めるJAMStackで使えるヘッドレスCMS達

フロントエンド

投稿日

ヘッドレスCMSがとてもきれいにまとまっていたサイトがあったので、ご紹介します。

https://headlesscms.org/

このサイトはJAMstackで作るためのコンテンツ管理システムの紹介をしているサイトです。

JAMstackの静的サイトジェネレーターの場合は下記でcheckできます。
https://www.staticgen.com/

JAMStackとは

JAMstackのJAMはJavaScript、API、Markupの略です。
クライアント側のJavaScript、再利用可能なAPI、および事前構築されたMarkupを用いて設計をする開発手法です。

開発したWebアプリケーションは、Webサーバーを使わずにCDNで配信できるため、大量のアクセスにも強く、配信コストも抑えられるのが特徴です。

JavaScript

動的な処理はすべてJavaScriptによって処理され、完全にクライアント上で実行されます。
これは、任意のフロントエンドフレームワーク、ライブラリ、またはVanillaJavaScriptでも同じです。

API

すべてのサーバー側プロセスまたはデータベースアクションは、再利用可能なAPIに抽象化され、JavaScriptを使用してHTTPS経由でアクセスされます。
これらは、カスタムビルドすることもサードパーティのサービスを活用することもできます。

マークアップ

マークアップはテンプレート化され、通常コンテンツサイト用のサイトジェネレーターまたはWebアプリケーション用のビルドツールを使用して、展開時に事前に構築します。

JAMStackが解決するもの

JAMStackで開発する事で下記のようなメリットを受けることができます。

  • 高速なレスポンス
  • パフォーマンスの良いSPA
  • 端末負荷・発熱・バッテリー消費を少なくできる
  • CMSのセキュリティ対応が容易
  • サーバーコストを安価にできる
  • サーバー運用トラブルを減らせる

JAMStackで不向きなコンテンツ

書き込みが中心となるWebアプリケーションやユーザー毎に違うコンテンツを表示するものの場合はJAMStackの恩恵が受けにくくなります。

APIでコンテンツの切り替えは可能ですので、JAMStackが使えないということはありません。

JAMStackで連携して使われるサービス

私が知っている・使っているサービスで有名なものをいくつかご紹介します。

  • Algolia
    • 検索の強化
  • Auth0
    • 認証システム
  • CircleCI
    • デプロイ周りの連携
  • Netlify
    • サーバー
  • Firebase
    • データベース