先週、MicroCMSに興味を持って作り始めていた物に切り替えました。デザインなどまだまだ未完成なので、これから調整していきます。リポジトリは<a href="https://github.com/nnmykn/kan-jamstack" target="_blank" rel="noopener noreferrer nofollow">コチラ</a><h2 id="hc202f5b15e">Jamstackとは？ by ChatGPT</h2>Jamstackは、現代のウェブ開発で利用されているアーキテクチャの一つで、JavaScript、APIs、Markup（JAM）の頭文字を取って名付けられました。このアーキテクチャは、より高速で、セキュアで、スケーラブルなウェブサイトを構築するためのものです。以下に、Jamstackの主なコンポーネントとその機能について詳しく説明します。<ol><li>JavaScript: これは、クライアントサイドで動作するプログラミング言語です。JavaScriptは、ウェブサイトのユーザーインターフェースを動的に作成するために使用されます。JavaScriptはブラウザ上で実行され、ユーザーとのインタラクションを処理したり、APIからデータをフェッチしたりします。</li><li>APIs: API（Application Programming Interfaces）は、サーバとクライアント間でデータをやり取りするためのインターフェースです。これにより、JavaScriptはサーバからデータを取得し、それをウェブページに表示できます。これらのAPIは、バックエンドサービス（例えばCMSやデータベースなど）との通信を可能にします。</li><li>Markup: これは、HTMLなどのマークアップ言語を指します。これらの言語は、ウェブページの構造と内容を定義します。Jamstackでは、事前に生成された静的なHTMLを使用します。これは、ウェブサイトのロード時間を大幅に短縮し、パフォーマンスを向上させることができます。</li></ol>Jamstackのアーキテクチャを採用すると、いくつかのメリットがあります。以下に主なものをいくつか挙げてみます：<ul><li>パフォーマンス: 静的ファイルを提供することで、ウェブサイトの読み込み速度が大幅に向上します。これは、ユーザーエクスペリエンスを向上させ、SEOのパフォーマンスを向上させることができます。</li><li>セキュリティ: バックエンドのサーバーを直接エクスポーズする必要がないため、セキュリティリスクが減少します。</li><li>スケーラビリティ: トラフィックの増加に対して簡単に対応することができます。これは、静的コンテンツはCDN（Content Delivery Network）を通じて配信されるため、大量のリクエストを処理する能力があります。</li><li>開発速度: 既存のAPIとツールを利用することで、開発プロセスを高速化することができます。</li></ul>以上がJamstackの基本的な説明です。このアーキテクチャは、ウェブ開発における新しいパラダイムを提供し、より効率的でパフォーマンスの高いウェブサイトの構築を可能にしています。しかし、同時に、Jamstackを使用するためには、静的サイトジェネレーター、API、そしてJavaScriptフレームワークの知識が必要となることも覚えておきましょう。このアーキテクチャが適しているのは、更新頻度が低いウェブサイトや、大量のユーザートラフィックを持つウェブサイトなど、特定のタイプのプロジェクトであると言えます。<figure><img src="https://images.microcms-assets.io/assets/4e60bdd3c02947b9a5fab15b78673a2e/8fd8f170c8c2489a9b6b3f6606b8f6e7/Untitled.png" alt="" width="1383" height="936"></figure>

NextJS × MicroCMSの構成で作り直しました！