概要

このラボでは、クイズ アプリケーションを Kubernetes Engine（旧称 Container Engine）にデプロイし、Cloud Build や Container Registry などの Google Cloud Platform リソースと、Deployment、Pod、Service などの Kubernetes リソースを利用します。

目標

このラボでは、次のタスクの実行方法について学びます。

• Dockerfile を作成して、クイズ アプリケーションのフロントエンド コードとバックエンド コードをデプロイ用にパッケージ化する。
• Cloud Build を使用して Docker イメージを作成する。
• クイズ アプリケーションをホストする Kubernetes Engine クラスタをプロビジョニングする。
• Kubernetes の Deployment を使用して、複製 Pod を Kubernetes Engine にプロビジョニングする。
• Kubernetes の Service を使用して、クイズのフロントエンド用ロードバランサをプロビジョニングする。

設定と要件

各ラボでは、新しい Google Cloud プロジェクトとリソースセットを一定時間無料で利用できます。

1. Qwiklabs にシークレット ウィンドウでログインします。

2. ラボのアクセス時間（例: 1:15:00）に注意し、時間内に完了できるようにしてください。
   一時停止機能はありません。必要な場合はやり直せますが、最初からになります。

3. 準備ができたら、[ラボを開始] をクリックします。

4. ラボの認証情報（ユーザー名とパスワード）をメモしておきます。この情報は、Google Cloud Console にログインする際に使用します。

5. [Google Console を開く] をクリックします。

6. [別のアカウントを使用] をクリックし、このラボの認証情報をコピーしてプロンプトに貼り付けます。
   他の認証情報を使用すると、エラーが発生したり、料金の請求が発生したりします。

7. 利用規約に同意し、再設定用のリソースページをスキップします。

Google Cloud Shell の有効化

Google Cloud Shell は、開発ツールと一緒に読み込まれる仮想マシンです。5 GB の永続ホーム ディレクトリが用意されており、Google Cloud で稼働します。

Google Cloud Shell を使用すると、コマンドラインで Google Cloud リソースにアクセスできます。

1. Google Cloud コンソールで、右上のツールバーにある [Cloud Shell をアクティブにする] ボタンをクリックします。

   

2. [続行] をクリックします。

環境がプロビジョニングされ、接続されるまでしばらく待ちます。接続した時点で認証が完了しており、プロジェクトに各自のプロジェクト ID が設定されます。次に例を示します。

gcloud は Google Cloud のコマンドライン ツールです。このツールは、Cloud Shell にプリインストールされており、タブ補完がサポートされています。

• 次のコマンドを使用すると、有効なアカウント名を一覧表示できます。

gcloud auth list

出力:

Credentialed accounts: - @.com (active)

出力例:

Credentialed accounts: - google1623327_student@qwiklabs.net

• 次のコマンドを使用すると、プロジェクト ID を一覧表示できます。

gcloud config list project

出力:

[core] project =

出力例:

[core] project = qwiklabs-gcp-44776a13dea667a6 注: gcloud ドキュメントの全文については、 gcloud CLI の概要ガイド をご覧ください。

タスク 1. ケーススタディ用アプリケーションを準備する

このセクションでは、Cloud Shell にアクセスしてクイズ アプリケーションを含む Git リポジトリのクローンを作成してから、環境変数を構成してアプリケーションを実行します。

Cloud Shell でソースコードのクローンを作成する

1. Cloud Shell で次のコマンドを実行して、クラスのリポジトリのクローンを作成します。

git clone --depth=1 https://github.com/GoogleCloudPlatform/training-data-analyst

2. 作業ディレクトリへのショートカットとしてソフトリンクを作成します。

ln -s ~/training-data-analyst/courses/developingapps/v1.3/nodejs/containerengine ~/containerengine

ケーススタディ用アプリケーションを構成してコードを確認する

1. 作業ディレクトリを変更します。

cd ~/containerengine/start

2. ファイルのデフォルトのリージョンをラボで割り当てられたリージョンに置き換えるには、次のコマンドを実行します。

export APP_REGION={{{project_0.startup_script.app_gcp_region | APP_REGION}}} export REGION={{{project_0.default_region | REGION}}} sed -i 's/us-central1/'"$REGION"'/g' prepare_environment.sh sed -i 's/us-central/'"$APP_REGION"'/g' prepare_environment.sh

3. クイズ アプリケーションを構成します。

. prepare_environment.sh 注: このスクリプト ファイルは以下の処理を行います。

• Google App Engine アプリケーションを作成する。
• 環境変数 GCLOUD_PROJECT と GCLOUD_BUCKET をエクスポートする。
• npm install を実行する。
• Google Cloud Datastore にエンティティを作成する。
• Google Cloud Pub/Sub トピックを作成する。
• Cloud Spanner のインスタンス、データベース、テーブルを作成する。
• Google Cloud Platform のプロジェクト ID を出力する。

4. Cloud Shell で [エディタを開く] をクリックします。
5. containerengine/start に移動します。

注: クイズ アプリケーションのフォルダ構造が変更され、Kubernetes Engine にデプロイされる状態になっています。

ウェブ アプリケーションは、frontend というフォルダにあります。

Cloud Pub/Sub にサブスクライブしてメッセージを処理するワーカー アプリケーションのコードは、backend というフォルダにあります。

構成ファイルは、Docker 用のもの（frontend フォルダと backend フォルダにある Dockerfile）と Kubernetes Engine 用のもの（*.yaml）があります。

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

タスク 2. Kubernetes Engine クラスタを作成する

このセクションでは、クイズ アプリケーションをホストする Kubernetes Engine クラスタを作成します。

Kubernetes Engine クラスタを作成する

1. Cloud Platform コンソールのナビゲーション メニューで、[API とサービス] をクリックします。

2. 有効になっている API のリストを下にスクロールして、次の API が両方とも有効になっていることを確認します。

   • Kubernetes Engine API
   • Google Container Registry API

いずれかの API がない場合は、上部にある [+ API とサービスの有効化] をクリックします。上記の API を名前で検索し、現在のプロジェクトでそれぞれを有効にします（GCP プロジェクトの名前はすでにメモしてあります）。

3. Cloud Platform コンソールのナビゲーション メニューで、[Kubernetes Engine] > [クラスタ] をクリックします。
4. [作成] をクリックします。
5. [使ってみましょう] をクリックし、[Standard クラスタに切り替え] をクリックします。
6. 次の表を使用してクラスタを構成します。

プロパティ	値
名前	quiz-cluster
ロケーション タイプ	ゾーン
ゾーン
[ノードプール] で、[default-pool] をクリックします。	[セキュリティ] > [アクセス スコープ] で、[すべての Cloud API に完全アクセス権を許可] を選択します。

7. [作成] をクリックします。

注: クラスタのプロビジョニングには数分かかります。

[進行状況を確認] をクリックして、目標に沿って進んでいることを確認します。 Kubernetes Engine クラスタを作成する

クラスタに接続する

1. クラスタの準備ができたら、右側のその他アイコンをクリックし、[接続] をクリックします。

2. 接続コマンドを Cloud Shell に入力するには、[クラスタに接続する] で [Cloud Shell で実行] をクリックします。コマンドは次のようなものになります。

gcloud container clusters get-credentials quiz-cluster --zone {{{project_0.default_zone|ZONE}}} --project {{{project_0.project_id|Project ID}}}

3. Enter キーを押し、Cloud Shell でコマンドを実行します。

4. クラスタ内の Pod を一覧表示します。

kubectl get pods 注: このコマンドのレスポンスで、クラスタ内に Pod がないことを確認します。

これで、kubectl コマンドライン ツールでクラスタへの操作を行えるようセキュリティが構成済みであることを確認できました。

タスク 3. Cloud Build を使用して Docker イメージをビルドする

このセクションでは、アプリケーションのフロントエンド用とバックエンド用の Dockerfile を作成します。次に、Cloud Build を使用してイメージをビルドし、Container Registry に格納します。

フロントエンドとバックエンド用の Dockerfile を作成する

1. Cloud Shell コードエディタで、frontend/Dockerfile を開きます。
2. 既存のテキストの後に、カスタム Docker イメージの作成を初期化する Dockerfile コマンドを入力します。このカスタム イメージのベースとなるのは Google の NodeJS App Engine イメージです。

注: 使用するイメージは、gcr.io/google_appengine/nodejs です。

3. 現在のフォルダの内容をイメージ内のコピー先フォルダ /app/ にコピーする Dockerfile コマンドを追加します。
4. ビルドプロセスの一環として npm install -g npm@8.1.3 を実行する Dockerfile コマンドを追加します。これにより、アプリケーションに対応したバージョンの npm がコンテナで実行されます。
5. npm update を実行する Dockerfile コマンドを追加します。
6. npm start ステートメントを入力して Dockerfile を完成させます。このステートメントはコンテナの実行時に実行されます。

...frontend/Dockerfile

FROM gcr.io/google_appengine/nodejs RUN /usr/local/bin/install_node '>=0.12.7' COPY . /app/ RUN npm install -g npm@8.1.3 --unsafe-perm || \ ((if [ -f npm-debug.log ]; then \ cat npm-debug.log; \ fi) && false) RUN npm update CMD npm start

7. Dockerfile を保存します。
8. backend/Dockerfile ファイルでも上記の手順を繰り返します。

...backend/Dockerfile

FROM gcr.io/google_appengine/nodejs RUN /usr/local/bin/install_node '>=0.12.7' COPY . /app/ RUN npm install -g npm@8.1.3 --unsafe-perm || \ ((if [ -f npm-debug.log ]; then \ cat npm-debug.log; \ fi) && false) RUN npm update CMD npm start

9. 2 つ目の Dockerfile を保存します。

Cloud Build を使用して Docker イメージをビルドする

1. Cloud Shell で、フロントエンド用の Docker イメージをビルドします。

gcloud builds submit -t gcr.io/$DEVSHELL_PROJECT_ID/quiz-frontend ./frontend/ 注: ファイルが Cloud Storage にステージングされ、Docker イメージがビルドされて Container Registry に保存されます。これには数分かかります。

2. バックエンドの Docker イメージをビルドします。

gcloud builds submit -t gcr.io/$DEVSHELL_PROJECT_ID/quiz-backend ./backend/

3. Cloud Platform コンソールのナビゲーション メニューで、[Artifact Registry] をクリックします。

注: quiz-frontend と quiz-backend の 2 つの項目が表示されます。

4. gcr.io リポジトリをクリックします。

5. quiz-frontend をクリックします。

注: イメージ名、タグ（latest）、サイズ（約 275 MB）が表示されていることを確認します。

タスク 4. Kubernetes の Deployment と Service の各リソースを作成する

このセクションでは、Kubernetes の Deployment リソースと Service リソースの仕様が含まれるテンプレート YAML ファイルに変更を加えてから、Kubernetes Engine クラスタ内のリソースを作成します。

Kubernetes の Deployment ファイルを作成する

1. Cloud Shell コードエディタで、frontend-deployment.yaml ファイルを開きます。

注: ファイルのスケルトンはすでに作成されています。プレースホルダをプロジェクトに固有の値に置き換えてください。

2. 以下の値を使用して、frontend-deployment.yaml ファイル内のプレースホルダを置き換えます。

プレースホルダ名	値
[GCLOUD_PROJECT]	GCP プロジェクト ID （プロジェクト ID を表示するには、Cloud Shell で echo $GCLOUD_PROJECT を実行）
[GCLOUD_BUCKET]	プロジェクトのメディア バケット用 Cloud Storage バケット名 （バケット名を表示するには、Cloud Shell で echo $GCLOUD_BUCKET を実行）
[FRONTEND_IMAGE_IDENTIFIER]	フロントエンド イメージの識別子（gcr.io/[Project_ID]/quiz-frontend の形式）

注: quiz-frontend の Deployment は、フロントエンド Docker イメージの 3 つのレプリカを Kubernetes Pod にプロビジョニングし、Kubernetes Engine クラスタの 3 つのノードに分散します。

3. ファイルを保存します。
4. 以下の値を使用して、backend-deployment.yaml ファイル内のプレースホルダを置き換えます。

プレースホルダ名	値
[GCLOUD_PROJECT]	GCP プロジェクト ID
[GCLOUD_BUCKET]	プロジェクトのメディア バケット用 Cloud Storage バケット ID
[BACKEND_IMAGE_IDENTIFIER]	バックエンド イメージの識別子（gcr.io/[Project_ID]/quiz-backend の形式）

注: quiz-backend の Deployment は、バックエンド Docker イメージの 2 つのレプリカを Kubernetes Pod にプロビジョニングし、Kubernetes Engine クラスタの 3 つのノードのうち 2 つに分散します。

5. ファイルを保存します。
6. frontend-service.yaml ファイルの内容を確認します。

注: Service は、ロードバランサを使用してフロントエンド Deployment を公開します。ロードバランサは、クライアントからのリクエストをフロントエンド Pod の 3 つのレプリカすべてに送信します。

Deployment ファイルと Service ファイルを実行する

1. Cloud Shell で、クイズのフロントエンド Deployment をプロビジョニングします。

kubectl create -f ./frontend-deployment.yaml

2. クイズのバックエンド Deployment をプロビジョニングします。

kubectl create -f ./backend-deployment.yaml

3. クイズのフロントエンド Service をプロビジョニングします。

kubectl create -f ./frontend-service.yaml 注: 上記の各コマンドにより、Kubernetes Engine にリソースがプロビジョニングされます。処理が完了するまでには数分かかります。

[進行状況を確認] をクリックして、目標に沿って進んでいることを確認します。 Kubernetes の Deployment と Service の各リソースを作成する

タスク 5. クイズ アプリケーションをテストする

ここでは、デプロイされた Pod と Service を確認し、クイズ アプリケーションを開きます。

デプロイされたリソースを確認する

1. Cloud コンソールのナビゲーション メニューで、[Kubernetes Engine] をクリックします。
2. [Kubernetes Engine] > [ワークロード] をクリックします。

注: quiz-frontend と quiz-backend の 2 つの Pod が表示されます。

Pod のステータスには OK または作成中と表示されます。OK になるまで、更新ボタンを数回クリックしなければならない場合があります。

3. quiz-frontend をクリックします。
4. [マネージド Pod] までスクロールします。

注: quiz-frontend Pod が 3 つ表示されます。

5. [Kubernetes Engine] > [Gateway、Service、Ingress] をクリックします。

6. [Services] タブをクリックします。

注: quiz-frontend ロードバランサのステータスとして、作成中または OK と表示されます。

Service が OK になったら続行します。

Service の準備が整うと、IP アドレスのエンドポイントが表示されます。

7. [エンドポイント] で、Service IP アドレスをクリックします。

注: クイズ アプリケーションが表示されます。

8. 質問を作成するか、テストを受けます。

注: アプリケーションが想定どおりに動作します。 注: 復習

コンテナの作成中に、コマンドを実行するのに使用する Docker コマンドはどれですか。

1. FROM
2. COPY
3. RUN
4. CMD

コンテナがデプロイされたときに、コマンドを実行するのに使用する Docker コマンドはどれですか。

1. FROM
2. COPY
3. RUN
4. CMD

クラスタで実行されている Pod を一覧表示するのに使用する Kubernetes コマンドはどれですか。

1. kubectl pods list
2. kubectl deployments list
3. kubectl get pods
4. kubectl get deployments

タスク 6. 参考: スコアボードを Kubernetes Engine にデプロイする

受講者がクイズを完了すると、解答が API 呼び出しでサーバーに送信されます。次に必要な作業は、受講者が送信した解答と正解をキャプチャし、それらを Cloud Spanner に保存することです。

以下に手順を示します。

1. answers という名前の Cloud Pub/Sub トピックを作成します。
2. 適切な列名とデータ型を指定して「Answers」という Cloud Spanner テーブルを作成します。
3. answers トピックに解答データを送信します。
4. 新しい answer-backend Deployment を作成して、アプリケーションがコンソール アプリケーションで answers トピックをサブスクライブし、Answers テーブルに解答データを挿入するよう設定します。
5. quiz-frontend でハンドラと pug テンプレートを作成して、ユーザーがスコアボードにアクセスしたときに Cloud Spanner からのデータが表示されるようにします。

後はご自由に詳細を設定してください。

ラボを終了する

ラボが完了したら、[ラボを終了] をクリックします。ラボで使用したリソースが Google Cloud Skills Boost から削除され、アカウントの情報も消去されます。

ラボの評価を求めるダイアログが表示されたら、星の数を選択してコメントを入力し、[送信] をクリックします。

星の数は、それぞれ次の評価を表します。

• 星 1 つ = 非常に不満
• 星 2 つ = 不満
• 星 3 つ = どちらともいえない
• 星 4 つ = 満足
• 星 5 つ = 非常に満足

フィードバックを送信しない場合は、ダイアログ ボックスを閉じてください。

フィードバックやご提案の送信、修正が必要な箇所をご報告いただく際は、[サポート] タブをご利用ください。

Copyright 2026 Google LLC All rights reserved. Google および Google のロゴは、Google LLC の商標です。その他すべての社名および製品名は、それぞれ該当する企業の商標である可能性があります。