Jamstackとは？超わかりやすく

HTML/CSS/JavaScript

2021.03.132021.03.24

Jamstackについて調べた結果メモ。

初心者向けに書きます。

Jamstackとは

「JavaScript＋API＋Markupを使ってサイトとかを管理しようぜー」なこと。

頭文字を取って「Jam」。

例えば、Wordpressでサイトを公開する場合、

という感じで、Wordpressがすべて管理します。

▲Wordpressだけでサイトを管理する場合。とてもシンプルです。

それに対して、Jamstackでサイトを公開する場合、

管理者：
- AサーバーのWordpressで記事を管理する
- AサーバーのWordpressから記事データを取ってこれるようにするためのAPIをWordpressに実装する（そのためのプラグインがある）
- WordPressのAPIから”自作のソフト”に記事データを抜き出して、そのデータを元にHTMLファイルを作成する。
- 作成したHTMLファイル郡をBサーバーにアップする。（これでサイトが公開されたことになる）
アクセスするユーザー：
- Bサーバーに対して「この記事ちょうだい」とお願いする

という感じの流れになります。

▲Jamstackでサイトを管理する場合。ややこしいです。

上の図は簡略化していて

実際には以下のような流れで運用されると思います。

▲実際にJamstackの運用で使われると思われる仕組み。ややこしい。

こういう感じで

みたいな感じで運用する形をJamstackと呼ぶらしいです。

データはAPIで提供されているので、他の媒体（例えばスマホアプリ）からもデータを取得できたりもします。

あと、ここではWordpressとしていますが、実際にはWordpressでなくて他のCMSでもいいですし、なんだったらCMSじゃなくて自作のAPIとかでも良いっぽいです。

なんだったら「自前でサーバーを用意してCMSをインストールする」みたいなことをしなくても

のようなSaasなCMSもあります。

おわり