arrow_back

Google Cloud でのウェブサイトの構築: チャレンジラボ

ログイン 参加
700 以上のラボとコースにアクセス

Google Cloud でのウェブサイトの構築: チャレンジラボ

ラボ 1時間 30分 universal_currency_alt クレジット: 5 show_chart 中級
info このラボでは、学習をサポートする AI ツールが組み込まれている場合があります。
700 以上のラボとコースにアクセス

GSP319

Google Cloud セルフペース ラボのロゴ

はじめに

チャレンジラボでは、シナリオと一連のタスクが提供されます。手順ガイドに沿って進める形式ではなく、コース内のラボで習得したスキルを駆使して、ご自身でタスクを完了していただきます。タスクが適切に完了したかどうかは、このページに表示される自動スコアリング システムで確認できます。

チャレンジラボは、Google Cloud の新しいコンセプトについて学習するためのものではありません。デフォルト値を変更する、エラー メッセージを読み調査を行ってミスを修正するなど、習得したスキルを応用する能力が求められます。

100% のスコアを達成するには、制限時間内に全タスクを完了する必要があります。

このラボは、「Google Cloud でのウェブサイトの構築」コースに登録している受講者を対象としています。準備が整ったらチャレンジを開始しましょう。

設定

[ラボを開始] ボタンをクリックする前に

こちらの説明をお読みください。ラボには時間制限があり、一時停止することはできません。タイマーは、Google Cloud のリソースを利用できる時間を示しており、[ラボを開始] をクリックするとスタートします。

このハンズオンラボでは、シミュレーションやデモ環境ではなく実際のクラウド環境を使って、ラボのアクティビティを行います。そのため、ラボの受講中に Google Cloud にログインおよびアクセスするための、新しい一時的な認証情報が提供されます。

このラボを完了するためには、下記が必要です。

  • 標準的なインターネット ブラウザ(Chrome を推奨)
注: このラボの実行には、シークレット モード(推奨)またはシークレット ブラウジング ウィンドウを使用してください。これにより、個人アカウントと受講者アカウント間の競合を防ぎ、個人アカウントに追加料金が発生しないようにすることができます。
  • ラボを完了するための時間(開始後は一時停止できません)
注: このラボでは、受講者アカウントのみを使用してください。別の Google Cloud アカウントを使用すると、そのアカウントに料金が発生する可能性があります。

チャレンジ シナリオ

あなたは、FancyStore, Inc. で新たな仕事を任されることになりました。

新しい業務内容は、既存の一体型のモノリシックな e コマース ウェブサイトを、論理的に分離された一連のマイクロサービスに切り分けることです。既存のモノリスコードは GitHub リポジトリに格納されています。このアプリをコンテナ化してリファクタリングすることが求められています。

これらのタスクを行うためのスキルや知識があるという前提であるため、手順ガイドは提供されません。

あなたは、チームリーダーに任命されました。前任チームはモノリス関連の業務によるストレスから離職し、現在ではまったく無関係な分野にいるそうです。あなたの業務は、ソースコードを取得してそれをもとにコンテナをビルドし(前任者の 1 人が Dockerfile を残してくれました)、GKE に push することです。

まずは、ソースコードが有効であることを確認するために、モノリスをビルド、デプロイ、テストします。次に、モノリスを構成しているサービスを、個々のマイクロサービス デプロイに切り分ける必要があります。

作業時には、以下の FancyStore, Inc. の規則に従う必要があります。

  • にクラスタを作成する。

  • 通常は team-resource の形式で命名する(たとえば、インスタンスには fancystore-orderservice1 のような名前を指定する)。

  • 費用対効果の高いサイズのリソースを割り当てる。プロジェクトはモニタリングされており、リソースが過剰に使用されているプロジェクトは強制終了されます。

  • 特に指示がない限り、マシンタイプは e2-medium を使用する。

チャレンジ

席に着いてノートパソコンを開くと、これらの作業を完了するための、次のようなリクエストが届いていました。それでは始めましょう。

タスク 1. モノリスコードをダウンロードしてコンテナをビルドする

  1. 新しいプロジェクトにログインして、Cloud Shell を開きます。

  2. まずは、チームの git リポジトリのクローンを作成します。プロジェクトのルート ディレクトリに setup.sh というスクリプトがあります。このスクリプトを実行して、モノリス コンテナをビルドします。

  3. setup.sh スクリプトを実行した後、Cloud Shell で最新バージョンの Node.js が実行されていることを確認します。

nvm install --lts

ビルドして push できるプロジェクトがいくつか表示されます。

  1. monolith ディレクトリに格納されているモノリスビルドを Artifact Registry に push します。~/monolith-to-microservices/monolith フォルダに格納されている Dockerfile を使用して、アプリケーション コンテナをビルドできます。

  2. アプリケーション コンテナをビルドするには(同じモノリス フォルダにある)Cloud Build を実行して、これを Artifact Registry に push します。

  3. 次のようにアーティファクトに名前を付けます。

  • Repo: gcr.io/${GOOGLE_CLOUD_PROJECT}
  • Image name:
  • Image version: 1.0.0

ヒント:

バージョンが「1.0.0」で名前が「」のビルドを送信してください。

[進行状況を確認] をクリックして、目標に沿って進んでいることを確認します。 モノリスコードをダウンロードしてコンテナをビルドする

タスク 2. Kubernetes クラスタを作成してアプリケーションをデプロイする

イメージを作成して Artifact Registry に格納したので、次はデプロイ先のクラスタを作成します。

すべてのリソースを ゾーンにデプロイするように指示を受けているので、そのための GKE クラスタを作成する必要があります。まず、3 ノードのクラスタから始めます。

  1. 次のようにクラスタを作成します。
  • Cluster name:

  • Region:

  • Node count: 3

ヒント:

クラスタの名前が「」で、このクラスタが で実行状態にあることを確認します。

イメージをビルドし、作成したクラスタが稼働していることを確認できたので、次はアプリケーションをデプロイします。

ビルドしたイメージをクラスタにデプロイするとアプリケーションが稼働しますが、一般公開するまでアクセスはできません。アプリケーションはポート 8080 で稼働しますが、よりユーザー フレンドリーなポート 80 に公開する必要があります。

  1. 以下のようにデプロイを作成して公開します。
  • Cluster name:
  • Container name:
  • Container version: 1.0.0
  • Application port: 8080
  • Externally accessible port: 80
注: このラボでは、便宜上サービスの公開を簡素化していますが、通常は、API ゲートウェイを使用してパブリック エンドポイントを保護します。ベスト プラクティスについて詳しくは、マイクロサービスのベスト プラクティス ガイドをご確認ください。
  1. デプロイの公開作業で割り当てられた IP アドレスをメモに残しておきます。この時点で、ご利用のブラウザからこの IP アドレスにアクセスできるようになっているはずです。

次の結果が表示されます。

Fancy Store のウェブページ

ヒント:

デプロイの名前が「」であること、サービスをポート 80 で公開していること、これをポート 8080 にマッピングしていることを確認してください。

[進行状況を確認] をクリックして、目標に沿って進んでいることを確認します。 Kubernetes クラスタを作成してアプリケーションをデプロイする

Fancy Store モノリシック アプリケーションをビルドしてデプロイできるようになったので、次はこれをマイクロサービスに分割していきましょう。

モノリスをマイクロサービスに移行する

既存のモノリス ウェブサイトを GKE で稼働させることができたので、各サービスのマイクロサービスへの分割を開始する準備が整いました。通常、計画の段階を設けて、小さなまとまりに分割するサービスを選定します。このとき、ビジネス ドメインなどのアプリケーションの特定の部分ごとに分割するのが一般的です。

このチャレンジの目的を達成するために、ここでは少し話を先に進めて、モノリスを注文(Orders)、プロダクト(Products)、フロントエンド(Frontend)という一連のマイクロサービスに無事に分割できたと仮定します。コードが完成したので、次はサービスをデプロイする必要があります。

タスク 3. 新しいマイクロサービスを作成する

個別のコンテナに分割する必要があるサービスが 3 つあります。すべてのサービスをコンテナに移動する予定のため、各サービスについて次の情報を追跡する必要があります。

  • サービスのルートフォルダ(コンテナをビルドする場所)
  • コンテナをアップロードするリポジトリ
  • コンテナ アーティファクトの名前とバージョン

コンテナ化されたバージョンのマイクロサービスを作成する

コンテナ化する必要のあるサービスは以下のとおりです。

  1. 以下のソースルートに移動して、作成したアーティファクトを、指定されたメタデータと一緒に Artifact Registry にアップロードします。

注文マイクロサービス

Service root folder: ~/monolith-to-microservices/microservices/src/orders

GCR Repo: gcr.io/${GOOGLE_CLOUD_PROJECT}

Image name:

Image version: 1.0.0

プロダクト マイクロサービス

Service root folder: ~/monolith-to-microservices/microservices/src/products

GCR Repo: gcr.io/${GOOGLE_CLOUD_PROJECT}

Image name:

Image version: 1.0.0

  1. これらのマイクロサービスがコンテナ化され、各サービスのイメージが Artifact Registry にアップロードされたら、これらのサービスをデプロイして公開する必要があります。

ヒント: バージョンが「1.0.0」で名前が「」のビルドと、バージョンが「1.0.0」で名前が「」のビルドを送信してください。

[進行状況を確認] をクリックして、目標に沿って進んでいることを確認します。 コンテナ化されたバージョンの注文とプロダクトのマイクロサービスを作成する

タスク 4. 新しいマイクロサービスをデプロイする

」モノリスに対して行った手順に沿って、これらの新しいコンテナをデプロイします。これらのサービスが複数のポートでリッスンするため、以下のテーブルのポート マッピングをメモに残しておくようにしてください。

  1. 以下のようにデプロイを作成して公開します。

注文マイクロサービス

Cluster name:

Container name:

Container version: 1.0.0

Application port: 8081

Externally accessible port: 80

プロダクト マイクロサービス

Cluster name:

Container name:

Container version: 1.0.0

Application port: 8082

Externally accessible port: 80

注: 注文とプロダクトの両方のサービスを公開したら、それぞれの IP アドレスをメモに残しておいてください。この IP アドレスは後で必要になります。

  1. ブラウザで以下の URL にアクセスして、デプロイが正常に行われたことと、サービスが公開されたことを確認できます。

http://ORDERS_EXTERNAL_IP/api/orders

http://PRODUCTS_EXTERNAL_IP/api/products

デプロイが正常に行われた場合は、各サービスで JSON 文字列が返されていることを確認できます。

ヒント: デプロイの名前が「」と「」であることと、これらのサービスがポート 80 で公開されていることを確認してください。

[進行状況を確認] をクリックして、目標に沿って進んでいることを確認します。 新しいマイクロサービスをデプロイする

タスク 5. フロントエンド マイクロサービスを構成、デプロイする

注文とプロダクトの両方のマイクロサービスを抽出したので、次はこれらをつなげるようにフロントエンド サービスを構成して、デプロイする必要があります。

フロントエンドを再構成する

  1. nano エディタを使用して、ローカル URL を新しいプロダクト マイクロサービスの IP アドレスに置き換えます。
cd ~/monolith-to-microservices/react-app nano .env

エディタを開くと、ファイルは以下のようになっています。

REACT_APP_ORDERS_URL=http://localhost:8081/api/orders REACT_APP_PRODUCTS_URL=http://localhost:8082/api/products
  1. REACT_APP_PRODUCTS_URL を新しい形式に置き換え、その際に IP アドレスを注文およびプロダクトのマイクロサービスのものにします。つまり、下記のようになります。
REACT_APP_ORDERS_URL=http://<ORDERS_IP_ADDRESS>/api/orders REACT_APP_PRODUCTS_URL=http://<PRODUCTS_IP_ADDRESS>/api/products
  1. Ctrl+O キー、Enter キーを押して nano エディタでファイルを保存し、Ctrl+X キーを押してエディタを閉じます。

  2. フロントエンド アプリをコンテナ化する前に再ビルドします。

npm run build

タスク 6. コンテナ化されたバージョンのフロントエンド マイクロサービスを作成する

「注文」および「プロダクト」のマイクロサービスをコンテナ化してデプロイし、これらをつなげるようにフロントエンドを構成しました。最終ステップでは、フロントエンドをコンテナ化してデプロイします。

Cloud Build を使用してフロントエンド サービスのコンテンツをパッケージ化し、これを Artifact Registry に push します。

  • Service root folder: ~/monolith-to-microservices/microservices/src/frontend
  • Repo: gcr.io/${GOOGLE_CLOUD_PROJECT}
  • Image name:
  • Image version: 1.0.0

この処理には数分かかることがあります。

ヒント: バージョンが「1.0.0」で名前が「」のビルドを送信してください。

[進行状況を確認] をクリックして、目標に沿って進んでいることを確認します。 コンテナ化されたバージョンのフロントエンド マイクロサービスを作成する

タスク 7. フロントエンド マイクロサービスをデプロイする

「注文」と「プロダクト」のマイクロサービスに対して行った手順と同様に、このコンテナをデプロイします。

  1. 以下のようにデプロイを作成して公開します。
  • Cluster name:
  • Container name:
  • Container version: 1.0.0
  • Application port: 8080
  • Externally accessible port: 80
  1. ブラウザでフロントエンド サービスの IP アドレスにアクセスして、デプロイが正常に行われたことと、マイクロサービスが正しく公開されたことを確認できます。

Fancy Store のホームページには、新しいマイクロサービスを利用したプロダクトと注文のページへのリンクが表示されています。

[進行状況を確認] をクリックして、目標に沿って進んでいることを確認します。 フロントエンド マイクロサービスをデプロイする

お疲れさまでした

Build_a_Website_on_Google_Cloud_Skill_WBG.png

Google Cloud トレーニングと認定資格

Google Cloud トレーニングと認定資格を通して、Google Cloud 技術を最大限に活用できるようになります。必要な技術スキルとベスト プラクティスについて取り扱うクラスでは、学習を継続的に進めることができます。トレーニングは基礎レベルから上級レベルまであり、オンデマンド、ライブ、バーチャル参加など、多忙なスケジュールにも対応できるオプションが用意されています。認定資格を取得することで、Google Cloud テクノロジーに関するスキルと知識を証明できます。

マニュアルの最終更新日: 2024 年 4 月 26 日

ラボの最終テスト日: 2023 年 12 月 5 日

Copyright 2025 Google LLC. All rights reserved. Google および Google のロゴは Google LLC の商標です。その他すべての企業名および商品名はそれぞれ各社の商標または登録商標です。

始める前に

  1. ラボでは、Google Cloud プロジェクトとリソースを一定の時間利用します
  2. ラボには時間制限があり、一時停止機能はありません。ラボを終了した場合は、最初からやり直す必要があります。
  3. 画面左上の [ラボを開始] をクリックして開始します

シークレット ブラウジングを使用する

  1. ラボで使用するユーザー名パスワードをコピーします
  2. プライベート モードで [コンソールを開く] をクリックします

コンソールにログインする

    ラボの認証情報を使用して
  1. ログインします。他の認証情報を使用すると、エラーが発生したり、料金が発生したりする可能性があります。
  2. 利用規約に同意し、再設定用のリソースページをスキップします
  3. ラボを終了する場合や最初からやり直す場合を除き、[ラボを終了] はクリックしないでください。クリックすると、作業内容がクリアされ、プロジェクトが削除されます

このコンテンツは現在ご利用いただけません

利用可能になりましたら、メールでお知らせいたします

ありがとうございます。

利用可能になりましたら、メールでご連絡いたします

1 回に 1 つのラボ

既存のラボをすべて終了して、このラボを開始することを確認してください

シークレット ブラウジングを使用してラボを実行する

このラボの実行には、シークレット モードまたはシークレット ブラウジング ウィンドウを使用してください。これにより、個人アカウントと受講者アカウントの競合を防ぎ、個人アカウントに追加料金が発生することを防ぎます。