Twitterを眺めていたら、JAMstackなるキーワードに遭遇し、気になったので調べてみました。
JAMstackは、公式サイトによると、
Modern web development architecture based on client-side JavaScript, reusable APIs, and prebuilt Markup.
のことのようで、特定のテクノロジーのことではなく、よいパフォーマンスで、セキュアで、低コストでスケールし、良い開発者の体験を伴ったWebサイトやアプリケーションの新しい構築方法である、と書かれています。
JAM stackは、J avaScript、A PIs、M arkupが語源となっていて、それぞれ次のような特徴があるようです。
リクエスト/レスポンスのサイクルの間の動的なプログラミングはすべてJavaScriptによって処理され、完全にクライアント上で実行される。これはどんなフロントエンドのフレームワーク、ライブラリ、あるいは一般的なJavaScriptでも構わない。
すべてのサーバーサイドプロセスまたはデータベースアクションは、JavaScriptを使用してHTTPS経由でアクセスされる再利用可能なAPIに抽象化されている。これらはカスタムメイドでもサードパーティのサービスを利用することもできる。
テンプレートマークアップは、通常はコンテンツサイト用のサイトジェネレータ、またはWebアプリケーション用のビルドツールを使用して、デプロイ時に事前に作成されるべきである。
事前にビルドされたファイルをCDNで配信するため、高いパフォーマンスが得られる。
サーバーサイドのプロセスはマイクロサービスなAPIに抽象化されるため、攻撃を受ける領域が減り、セキュアになる。
デプロイがどこにでも提供できるファイルのスタックになると、スケーリングはより多くの場所でそれらのファイルを提供することの問題になる。CDNはこれに最適であり、多くの場合、すべてのプランにスケーリングが含まれているので、安価かつ簡単にスケーリングできる。
Loose coupling and separation of controls allow for more targeted development and debugging, and the expanding selection of CMS options for site generators remove the need to maintain a separate stack for content and marketing.
ちょっと意味がわからない...
では、JAMstackなサイトはどう作るのか、については、
Static Websites + JAMstack = <3 ｜ Julian Gaviria — Web Designer
という記事が参考になります。
この記事では、
という手順が書かれています。
上記の記事では、具体的なサービスとして、Netlify、AWS S3、Cloudflareが挙げられています。
上記の記事では、具体的なツールとして、Jekyll、Hugoが挙げられています。また、
StaticGen ｜ Top Open Source Static Site Generators
で、JAMstackなサイトで使えるStatic Site Generatorがリストアップされています。
Headless CMSというのは今回初めて知りました。通常のCMSといえば、WordPressのようにコンテンツを管理する機能と、それを公開する機能が備わっていますが、Headless CMSは、乱暴な言い方かもしれませんが、後者を削ぎ落としたCMSのようです。
上記の記事では具体的なサービスは書かれていませんが、
headlessCMS ｜ Top Content Management Systems for JAMstack sites
で、JAMstackなサイトで使えるHeadless CMSがリストアップされています。
JAMstackを採用すると、
というメリットが得られ、具体的には、
で実現する、というように理解しました。
このブログはJekyllで作っているのですが、CDNもHeadless CMSも使ったことがないので、何か作ってみたくなりました。