102
90

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

2018年のトレンドになるかもしれないJAM Stackの日本語情報がなかったので和訳してみる

Last updated at Posted at 2018-04-13

TL;DR

Why JAM Stack?

フロントエンドを業務で触らないエンジニアだけどYoutubeでJAM Stackに関するトークの動画を見て、
マイクロサービスアーキテクチャとかサーバレスアーキテクチャとかSSRとかSPAといったスキームを統合して呼称できる概念で、
かつ今後マイクロサービスとかウェブアプリケーションの構成として当たり前になって行くなと言う印象を受けたので、
イケてる実例とかを探して見たものの日本語のドキュメントや話題が皆無だったので、
自分で邦訳して界隈のトレンドリーダーに一瞬でもなってやろうと思いました。まる。

この記事では https://jamstack.org の内容を邦訳していきます。

JAM Stack

JAMStack : 名詞

クライアントサイドJavaScript, 再利用可能なAPI、マークアップの3つを組み合わせた モダンなウェブ開発のスタック

私たちが"このスタック"と言う時に私たちはオペレーティングシステムやある特定のWebサービスやサーバーサイドの開発言語やデータベースに関する話をもはや行なっていません

JAM Stackとは何か

つぎの三つの主要な要件を満たしていれば、あなたのプロジェクトはすでにJAM Stackを採用していると言えるでしょう

JavaScript

クライアントサイドのみで処理され動的にリクエストとレスポンスのサイクルを管理していること。
これはどんなJavaScriptのライブラリでもフロントエンドフームワークでも、バニラなJSの実装であっても構いません

APIs

全てのサーバーサイドのプロセスまたはデータベース操作は再利用可能なAPIによって抽象化され、JavaScriptによってHTTP経由で操作されること。
APIは自作されたものであれ、外部の第三者によって提供されたサービスのものであれ構いません

Markup

マークアップは、テンプレート化され、デプロイ時に静的サイトの生成ツールやアプリケーションのビルドツールによって事前にビルドされていなければいけません

JAM Stackを用いていないウェブサイトはどのようなものか?

いかなるプロジェクトであれ、サーバーサイドとクライアントサイドが密結合な場合にはJAM Stackにのっとって実装されているとは言えません。
具体的には以下のような場合です

・WordPressのようなサーバーサイドCMSで構成されたサイトはJAM Stackではありません

・RubyやNodeといった言語で実装されたモノリシックなサーバーサイドアプリケーションに依存するような場合にはそれはJAM Stackではありません

・実行時にサーバーサイドとクライアントサイドでアイソモーフィックなレンダリングを行うSPAはJAM Stackではありません

##なぜ JAM Stackなのか?

より良いパフォーマンス

なぜデプロイ時にビルドしておけるものを都度ビルドされるまで待つのでしょうか?
最初の1バイトにかかる時間を最小化するのに、事前にビルドされCDNでホスティングされるファイルより優れたものはありません

より強いセキュリティ

サーバーサイドの処理がマイクロサービスのAPIへ抽象化されていることで、
攻撃への対策を減らすことができ、高度なサードパーティサービスを活用したドメインの専門化を行うことができます。

安価で、スケーラブルであること

どこにでも配信できるような規模のファイルしか持たない時に、問題となるのはいかに多くの場所で配信を行うかと言うことです。
CDNはその際に最適なサービスで、そして大抵の場合はホスティングをスケールすることができます。

より良い開発体験

サーバー・クライアント間の依存を減らし、処理を分割して行くことで、より開発とデバッグに集中することができます。
また、CMSやサイトジェネレータの選択肢が拡大することで、コンテンツとマーケティングの二つのスタックをメンテナンスする必要性をなくすことができます。

EOC End of Contents

以上、拙訳で申し訳ないですが、 https://jamstack.org のindexページに記載された概要をGoogle翻訳や辞書を使わずに翻訳してみました。
フロントエンドのエンジニアではない上にモダンの最先端トレンドを追っかける仕事でもないので、用語の理解や翻訳に誤りがあるとは思いますが、気兼ねなくコメントマサカリをぶん投げていただければ修正していきます。

End Note...

JAM Stackとはつまるところ、複数のマイクロサービスAPIを使用するSPAをCDNでホスティングする。
と言うスタックのことです。サーバレスとプレビルドのSPAの組み合わせによってサーバレスSPAというスタックが生まれ、
界隈で話題になりだしていますが、つまりそれです。
フロントSPA化と、バックエンドのAPI化&マイクロサービス化によってスケーラビリティはメインテナンスのしやすさを確保したまま、アプリケーションを多機能化して行くためのデザインパターンなのです。

そんなんしってるよ!/やってるよ!と言う人は多いかもしれませんが、
命名することによって事象を構造化し認知可能なものにすると言うのは構造主義的には正しい認知手段です。
これによってSSPAやSSR SPA+MicroService系のスタックがJAM Stackという名前と定義を獲得し、
より広がって行くことを楽しみに2018年を過ごしてみようと思います。

参考

The JAM Stack: The New Front-End Stack For Web Development
JAM Stack | JavaScript, APIs, and Markup

102
90
3

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
102
90

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?