はじめに

完了

あなたは、eコマース サイトで働いています。 あなたは、製品ページが検索エンジンによって検出され、すぐに読み込まれるようにしようと考えています。 選択する技術アプローチが何であっても、アーキテクチャのベスト プラクティスに従うものを使用するつもりです。 必要な場合にヘルプを見つけることができるように、一般的に使用されているフレームワークと手法を選択する必要があります。

このようなアプリを構築する方法の 1 つは、"静的サイト ジェネレーター" を使用することです。 静的サイト ジェネレーターを使用すると、JSON ファイル、XML ファイル、YAML ファイル、データベースなどの内部、さらには Web 経由でアクセスできるサードパーティのサービスなど、あらゆる種類の場所にあるコンテンツやデータから、静的サイトを組み立てることができます。 そのため、このような静的ページの生成は、少し複雑なプロセスです。 したがって、静的ページを生成するには、静的サイト生成ツールを使用することが必要になります。

これらの静的ページを生成した後、それらを Web にデプロイする方法を検討する必要があります。 競争力を維持するため、ページを簡単かつ迅速にデプロイできるサービスが必要です。 アプリのデプロイを構成するために費やす時間が短いほど、機能の向上により多くの時間をかけられます。

このモジュールでは、Gatsby コマンドライン ツールを使用して、新しい Web アプリを作成します。 アプリでページを作成し、Gatsby のクエリ ツールでそれにコンテンツを追加します。 最後に、Azure Static Web Apps サービスを使用して Web にアプリをデプロイします。

モジュールが終了すると、Gatsby を使用して Web アプリを作成し、Web に発行できるようになります。

学習の目的

このモジュールでは、次のことを行います。

  • Gatsby を使用して静的 Web アプリを作成する
  • GraphQL クエリを使用してアプリのページにデータを追加する
  • Azure Static Web Apps を使用して Web にアプリをデプロイする

前提条件

  • お使いのコンピューターに GitNode.js がインストールされていること
  • 任意のテキスト エディターでテキスト ファイルとコード ファイルを編集できること
  • Gatsby を利用したアプリケーションのビルドに関する初心者レベルの経験
  • Git の操作など、コマンド ラインの使用経験
  • GitHub アカウント