JAMStackなサイトをつくる案件をしてみて感じた利点

[ひとことで言うと、こんな記事]

JAMStackの利点をうまく使えば、障害リスク少なくWebサイト運用を受け持つこともできます!


[こんなひとにおすすめ]

  • JAMStackの基本をある程度知りたい方
  • JAMStackの一般的な利点を知りたい方
  • JAMStackの案件を実際やっている人の実例をみてみたい方

実際に4つのJAMStack案件に携わった私が、実際に感じた利点を読んでいただきたいです。


[目次]

  • JAMStackとは
  • JAMStackのなにが嬉しいのか?(一般論)
  • 筆者が実際にJAMStack案件を実施してみて感じた最大の利点は「運用でのリソース監視場所が極端に減る」こと
  • 運用リスクが低減したことで起こった私の変化
  • まとめ:JAMStackの利点

JAMStackとは

公式はなんと言っている?

公式ページを見てみます。

When we talk about “The Stack”, we no longer talk about operating systems, specific web servers, backend programming languages, or databases.

引用:https://jamstack.org/

「OS、特定のWebサーバー、バックエンドのプログラミング言語、データベースについて話しません。」との記載があります。

「Webアプリって、上記の技術ありきで成立してませんでしたっけ??」と思うような記述がありました。

WebアプリケーションとJAMStackの比較

Webアプリケーションの場合

benefit-jamstack-01

毎度、「ブラウザ ⇄ サーバー処理 ⇄ データストア」とやりとりしていました。

JAMStackの場合

benefit-jamstack-02

クライアントとのやり取りは「ブラウザ ⇄ ファイル置き場」 のみとなってます。

それに必要なものは事前に全部ビルドし終えて乗っけている形となります。

参考:[Jamstackって何なの?何がいいの?

](https://qiita.com/ozaki25/items/4075d03278d1fb51cc37)

JAMStack実現に必要なもの

上記の図に当てはめてみると、以下のような登場人物が必要になります

benefit-jamstack-03

ヘッドレスCMS

  • 入稿フォームが簡単に作成でき、データの蓄積が容易
  • 蓄積したデータを利用できるAPIの準備が容易

静的サイトジェネレーター

  • 入稿したデータをAPIから取得し、 ページを作成を容易にしてくれる フレームワーク

ホスティングサービス

  • 準備できた静的サイトを配信する場所

JAMStackのなにが嬉しいのか?(一般論)

Why the Jamstack?

  • Better Performance
  • Higher Security
  • Cheaper, Easier Scaling
  • Better Developer Experience

引用:https://jamstack.org/

公式に書いてありますが、およそ2種類に分けられているのではと考えます。

  • よりよい性能
  • より高いセキュリティ
  • 安価でかんたんなスケーリング

↑ ホスティング前にすべてビルドしたものを容易することから

  • 開発者エクスペリエンスの向上

↑ データストックとページ生成の役割を分離したことから

ここは、仕組みがわかっていればけっこう合点が行くとおもいますので、ぜひ公式サイトをご覧ください。

筆者が実際にJAMStack案件を実施してみて感じた最大の利点は「運用でのリソース監視場所が極端に減る」こと

やっと1番伝えたい点まできました。

  • 安価でかんたんなスケーリング

上記に該当することだとは思うのですが、Webアプリの監視対象とリスクを、いままでのWebアプリケーションとJAMStackで比較してみました。

Webアプリケーションの場合のリソース監視

benefit-jamstack-04

リソース監視の特徴

  • Webサーバーでの処理が高負荷になって落ちたら DEAD
  • Databaseの処理が重たくなって落ちたら DEAD

JAMStackの場合のリソース監視

benefit-jamstack-05

リソース監視の特徴

  • ホスティングサービスが死んだら同じくDEADだが、 静的ファイルおいてあるだけのサーバーが落ちる気がしない ALIVE
  • ヘッドレスCMSなどのデータストアが死んだとしても、あたらしいコンテンツが更新されないのはあるが、 いままでの記事までの状態でサイトは落ちることはない ALIVE

運用リスクが低減したことで起こった私の変化

2018年から個人事業を本業の横で実施してきました。その中での仕事の幅が増えました。

JAMStackを知る前

ずっと__納品するだけの案件しか実施してきませんでした。__

  • LP制作
  • メディア入稿用のMarkup

理由は、__平日フルタイムで業務を持っている私が有事の際、お客様に早急な障害対応を実施し、サービスレベルを維持する自信がなかったから__です。

JAMStackを知ってから

しっかりと自信をもって、以下のような__サービスを継続的に運用する必要がある案件__にも携わることができました。

  • コーポレートサイト
  • ブログ
  • メディア(問い合わせがコンバージョンとなるサイト)
  • (ついでに自分のサイト)

まとめ:JAMStackの利点は多い

公式サイトより

利点 理由
よりよい性能 バックエンドの処理がおわってからのレンダリングじゃない
より高いセキュリティ サーバー側のプロセスがない
安価でかんたんなスケーリング 静的ファイルを提供することのみに注力すればよい
開発者エクスペリエンスの向上 データストアと疎結合でやりやすい

個人的な経験から

利点 箇所 理由
運用でのリソース監視場所が極端に減る ホスティングサーバー ファイルおいてあるだけなので__リスク低__
データストア 障害が起きても 既存のサイトは死なない

__一緒に様々なことを学んでいく仲間を募集__しています。

このサイトのお問い合わせなどからご連絡いただけると幸いです。