Web開発アーキテクチャ「JAMスタック」がなぜ人気になっているのか

Post on:2019年11月5日

静的サイトジェネレーターが最近、非常に普及してきました。
それに合わせて注目されているのが「JAMスタック」です。JAMスタックとは何なのか、なぜJAMスタックが人気になっているのかを紹介します。

Web開発アーキテクチャ「JAMスタック」がなぜ人気になっているのか

Why JAMstack is Becoming so Popular
by Luca Spezzano

下記は各ポイントを意訳したものです。
※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。

はじめに

最近、静的サイトジェネレーターが非常に普及してきています。静的サイトジェネレーターは使い方が簡単で、最新のテクノロジーとVue.jsやReactなどのJavaScriptフレームワークに基づいて実装されています。静的サイトジェネレーターをはじめ、モダンブラウザ、CDN、APIのおかけで、Web開発者はサーバーサイドからクライアントサイドのアプリケーションへと移行しています。

これを受けて、NetlifyはJAMスタックという新しい用語を発表しました。
JAMstackとは何なのか、なぜJAMスタックが注目されているのか見てましょう。

JAMスタックとは

JAMスタックはテクノロジーではなく、JAMスタックはWebサイトやアプリを構築する新しい方法です。クライアントサイドに基づいた最新のWeb開発アーキテクチャで、Webサーバーには依存しません。

サイトのキャプチャ

JAMstack

ブログでこんな言葉を見かけました。

JAMスタックは静的なHTMLサイトで、コンテンツを更新するたびに自動的に再構築され、CDNに直接デプロイされます。

JAMスタックを表現する定義としては、私はこちらの方が良いと思います！
ちなみにJAMスタックのJAMは、JavaScript、API、Markupの頭文字です

  • JavaScript
    リクエスト・レスポンスのサイクル中の動的プログラミングは、すべてJavaScriptで処理され、完全にクライアント上で実行されます。これは、どんなフロントエンドのフレームワークやライブラリでもよく、バニラJavaScriptでもかまいません。
  • APIs
    すべてのサーバーサイドのプロセスまたはデータベースのアクションは、再利用可能なAPIに抽象化され、JavaScriptを使用してHTTPS経由でアクセスされます。これらは、カスタムビルドすることも、サードパーティのサービスを活用することもできます。
  • Markup
    テンプレートのマークアップは通常、コンテンツサイト用のサイトジェネレーターやWebアプリのビルドツールを使用して、デプロイ時にあらかじめ構築しておく必要があります。

JAMスタックを使用する利点

JAMスタックを使用する主な利点は、下記のとおりです。

より高速で、優れたパフォーマンス

JAMスタックはデプロイ時に新しいページを生成し、CDNでビルド済みのマークアップとアセットを提供することができます。

低コストで、拡張が容易

開発の複雑さが軽減されることでコストが削減され、静的ファイルのホスティングも低コストまたは無料です。

セキュリティの強化

サーバーサイドとデーターベースの操作を委任することで、脆弱性を心配する必要がなくなります。

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

フロントエンドの開発者は、フロントエンドとデバッグにのみ集中できます。サイトジェネレーターのCMSオプションの選択肢が広がるため、保守の必要はなくなります。これにより、より迅速で集中的な開発を行えます。

JAMスタックのワークフロー

JAMスタックのワークフロー

WordPressのサイトにアクセスすると、通常はロードに非常に時間がかかることに気がつきます。この原因はデータベースに対して多くのリクエストをするからです。
JAMスタックでは、HTMLがロードされたら個別のAPIを呼び出して、必要に応じて動的データを取得できます。これにより、サイトの速度と効率が大幅に向上します。

JAMスタックはなぜ人気があるのか

これは主に3つの理由があると思います。

  • まずは、上記の利点のリスト。
  • 開発者が最新ののJavaScriptフレームワークでWebサイトを構築するのに役立つ静的サイトジェネレーターを使用する機会が得られる。
  • APIを介してコンテンツにアクセスできるヘッドレスCMSの驚異的な増加。

まとめ

JAMスタックを使用する可能性は、無限にあります。CMSを必要とする単純なブログやサイトをはじめ、eコマース、さらに複雑なWebアプリまで。この記事では、JAMスタックを使用する利点となぜ人気があるのかについて説明しました。

JAMスタックはあなたのニーズを満たすことができるので、もっと学ぶことを強くお勧めします。

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

最も人気のある静的サイトジェネレーターには、Nuxt.js（Vue.js）、Gridsome（Vue.js）、Next.js（Next.js）、Gatsby（React）、Jekyll、Hugoなどがあります。

バックエンド機能用のヘッドレスCMS

最も人気のあるヘッドレスCMSには、Netlify、Contentful、Strapi、Ghost、Prismicなどがあります。

JAMスタックの有用なリソース

JAMスタック用のテーマファイルも豊富にあります。

サイトのキャプチャ

JAMstack Themes

sponsors

top of page

©2024 coliss