概要

このラボでは、App Engine フレキシブル環境にクイズ アプリケーションをデプロイし、バージョンやトラフィック分割などの App Engine の機能を活用します。

目標

このラボでは、次のタスクを行う方法を学びます。

• app.yaml ファイルを作成して、アプリケーションの App Engine フレキシブル環境の要件を指定する。

• App Engine フレキシブル環境にクイズ アプリケーションをデプロイする。

• バージョンとトラフィック分割を使用し、アプリケーションの機能に対して A/B テストを行う。

設定と要件

各ラボでは、新しい 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 は、GCP リソースへのコマンドライン アクセスを提供します。

1. GCP Console の右上のツールバーにある、「Cloud Shell をアクティブにする」ボタンをクリックします。

   

2. Continue をクリックします。

   

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

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

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

gcloud auth list

出力:

Credentialed accounts:
 - <アカウント名>@<ドメイン名>.com（有効）

出力例:

Credentialed accounts:
 - google1623327_student@qwiklabs.net

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

gcloud config list project

出力:

[core]
project = <プロジェクト ID>

出力例:

[core]
project = qwiklabs-gcp-44776a13dea667a6

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

このセクションでは、Cloud Shell にアクセスしてクイズ アプリケーションが格納されている Git リポジトリのクローンを作成してから、環境変数を設定してアプリケーションを実行します。

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

1. クラスのリポジトリのクローンを作成します。

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

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

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

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

1. このラボのサンプル ファイルが含まれているディレクトリに移動します。

cd ~/appengine/start

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

. prepare_environment.sh

3. Cloud Shell で [エディタを開く] をクリックします。プロンプトが表示されたら、[新しいウィンドウで開く] をクリックします。
4. appengine/start に移動します。

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

App Engine フレキシブル環境用のアプリケーション コードを用意する

このセクションでは、クイズ アプリケーションのフロントエンドを App Engine フレキシブル環境にデプロイするために構成ファイルを変更します。

フロントエンド用の app.yaml ファイルを作成する

1. Cloud Shell コードエディタで、appengine/start/frontend/app.yaml を開きます。
2. 2 つの key: value ペアを追加し、スケーリングを手動に設定します。

• 1 つ目のペアで、nodejs ランタイムを使用することを指定します。

• 2 つ目のペアで、フレキシブル環境を使用することを指定します。

• インスタンスの数は 1 に設定されます。通常、本番サービスはより多くのインスタンスに拡張できるようにする必要があります。

...frontend/app.yaml

runtime: nodejs env: flex manual_scaling: instances: 1

3. appengine/start/frontend/config.json ファイルを変更して GCLOUD_BUCKET キーとその値を追加します。値は、プロジェクトの -media バケットの名前（<GCP-Project-ID>-media）とします。

...frontend/config.json

{ "GCLOUD_BUCKET" : "<バケット名に置き換える>" }

4. ファイルを保存します。

フロントエンドを App Engine フレキシブル環境にデプロイする

1. Cloud Shell で、クイズ アプリケーションを App Engine フレキシブル環境にデプロイします。

gcloud app deploy ~/appengine/start/frontend/app.yaml

「Do you want to continue (Y/n)?」と尋ねられたら、Y キーを押します。

2. デプロイが完了するまで待ちます。
3. Cloud Platform Console のナビゲーション メニューで、[App Engine] をクリックします。
4. App Engine ダッシュボードの右上で、アプリケーションのリンクをクリックします。

フロントエンドを App Engine フレキシブル環境にデプロイする

App Engine フレキシブル環境のアプリケーションを更新する

このセクションでは、アプリケーション コードを変更し、アプリケーションを再デプロイします。

クイズ アプリケーションを更新する

1. Cloud Shell コードエディタで、appengine/start/frontend/web-app/views/home.pug ファイルを開きます。

2. 最上位の見出しに感嘆符をいくつか追加します。

...frontend/web-app/views/home.pug

extends base.pug block content h1 Welcome to the Quite Interesting Quiz!!!!!!!!!! .jumbotron p Welcome to the Quite Interesting Quiz where you can create a question, take a test or review feedback h3.col-md-4 a(href="/questions/add") Create Question h3.col-md-4 a(href="/client/") Take Test h3.col-md-4 a(href="/leaderboard") Leaderboard

3. ファイルを保存します。

更新したアプリケーションをデプロイする

1. Cloud Shell で、App Engine アプリケーションを再デプロイします。

gcloud app deploy ~/appengine/start/frontend/app.yaml --no-promote \ --no-stop-previous-version

「Do you want to continue (Y/n)?」と尋ねられたら、Y キーを押します。

2. Cloud Platform Console のナビゲーション メニューで、[App Engine] > [ダッシュボード] をクリックします。
3. ウィンドウの右上にあるアプリケーションの URL をクリックします。アプリケーションが古いタイトルのままで表示されます。
4. [App Engine] ウィンドウで、[バージョン] をクリックします。

5. 新しいバージョンのリンクをクリックします。

6. チェックボックスを使ってアプリケーションの両方のバージョンを選択し、[バージョン] ページの右上にある [トラフィックを分割] をクリックします。
7. 50% が古いバージョンに、50% が新しいバージョンに送信されるようにトラフィックの割り当てを構成します。
8. 各バージョンにトラフィックをランダムに分割するよう指定するラジオボタンを選択します。
9. [保存] をクリックします。
10. サイトに移動し、ホームページを何度か更新します。

App Engine フレキシブル環境のアプリケーションを更新する

参考

Cloud デバッガと Cloud Error Reporting の機能をアプリケーションで有効にすることもできます。アプリケーション エラーのデバッグに関するラボガイドの手順に沿って、以下の操作を行います。

1. Cloud Source Repositories のリポジトリを作成する。
2. 適切なコードをリポジトリに push する。
3. Cloud デバッガと Cloud Error Reporting を設定する。
4. デバッグのスナップショットとログポイントを確認する。
5. Error Reporting を確認する。
6. Cloud Logging を表示する。

ラボを終了する

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

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

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

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

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

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

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