演習 - Azure DevOps 環境を設定する
このセクションでは、このモジュールの残りの部分を完了するために、Azure DevOps 組織が確実に設定されるようにします。 また、後でデプロイ先の Azure App Service 環境も作成します。
これらの目標を達成するには、次の作業を行います。
- ユーザーを追加して、Azure DevOps をお使いの Azure サブスクリプションに接続できることを確認します。
- このモジュール用の Azure DevOps プロジェクトを設定します。
- Azure Boards 上で、このモジュールの作業項目を [実行中] 列に移動します。
- 変更をパイプラインにプッシュできるように、ローカルでプロジェクトが設定されていることを確認します。
- Azure Cloud Shell の Azure CLI を使用して、Azure App Service 環境を作成します。
- App Service 環境の名前を定義するパイプライン変数を作成します。
- Azure Pipelines で Azure サブスクリプションに安全にアクセスできるようにするサービス接続を作成します。
Azure DevOps にユーザーを追加する
このモジュールを完了するには、自分の Azure サブスクリプションが必要です。 Azure は無料で使用開始できます。
Azure DevOps を使うために Azure サブスクリプションは必要ありませんが、ここでは、Azure DevOps を使って、Azure サブスクリプション内にある Azure リソースにデプロイします。 このプロセスを簡略化するには、お使いの Azure サブスクリプションと自分の Azure DevOps 組織の両方に、同じ Microsoft アカウントを使用してサインインします。
異なる Microsoft アカウントを使用して Azure と Azure DevOps にサインインする場合は、Azure へのサインインに使用する Microsoft アカウントで、DevOps 組織にユーザーを追加します。 詳細については、組織またはプロジェクトへのユーザーの追加に関する記事を参照してください。 ユーザーを追加する際、Basic アクセス レベルを選択します。
次に、Azure DevOps からサインアウトし、サインインします。 お使いの Azure サブスクリプションへのサインインに使用する Microsoft アカウントを使用します。
Azure DevOps プロジェクトを取得する
ここでは、このモジュールの残りの部分を完了するために、Azure DevOps 組織が確実に設定されるようにします。 これを行うには、Azure DevOps にプロジェクトを作成するテンプレートを実行します。
このラーニング パスのモジュールは段階的なプロセスになっています。 Tailspin Web チームの DevOps 導入作業を見ていきます。 学習目的のために、各モジュールには独自の Azure DevOps プロジェクトがあります。
テンプレートの実行
Azure DevOps 組織を設定するテンプレートを実行します。
Azure DevOps Demo Generator サイトから、以下の手順に従ってテンプレートを実行します。
[サインイン] を選択して利用規約に同意します。
[新しいプロジェクトの作成] ページで、ご自分の Azure DevOps 組織を選択します。 プロジェクト名を「Space Game - web - Multistage」のように入力します。
[Yes, I want to fork this repository]>[Authorize] を選択します。
ウィンドウが表示されたら、自分の GitHub アカウントへのアクセスを承認します。
重要
テンプレートで GitHub リポジトリに接続する場合は、このオプションを選択する必要があります。 既に Space Game Web サイト プロジェクトをフォーク済みである場合も選択してください。 テンプレートでは既存のフォークが使用されます。
[プロジェクトの作成] を選択します。
テンプレートの実行には少し時間がかかります。
[Navigate to project] を選択して、Azure DevOps の自分のプロジェクトに移動します。
重要
このモジュールの「Azure DevOps 環境をクリーンアップする」ページには、重要なクリーンアップ手順が含まれています。 クリーンアップによって、無料のビルド時間の浪費を抑えることができます。 このモジュールを完了しなかった場合でも、クリーンアップ手順を必ず行ってください。
プロジェクトの可視性を設定する
最初は、GitHub 上の Space Game リポジトリのフォークはパブリックに設定され、Azure DevOps テンプレートによって作成されたプロジェクトはプライベートに設定されます。 GitHub 上のパブリック リポジトリには誰でもアクセスできますが、プライベート リポジトリには自分のほかに共有することを選択したユーザーのみがアクセスできます。 同様に、Azure DevOps では、パブリック プロジェクトでは認証されていないユーザーに読み取り専用アクセスを提供しますが、プライベート プロジェクトではユーザーがサービスにアクセスするにはアクセス権の付与と認証が必要です。
現時点では、このモジュールにおいてこれらの設定を変更する必要はありません。 ただし、個人のプロジェクトでは、他のユーザーに付与する可視性とアクセス権を決定する必要があります。 たとえば、プロジェクトがオープンソースの場合は、GitHub リポジトリと Azure DevOps プロジェクトの両方をパブリックにすることを選択できます。 プロジェクトが独自のものである場合は、GitHub リポジトリと Azure DevOps プロジェクトの両方をプライベートにするのが一般的です。
後で、プロジェクトに最適なオプションを決定する際に、次のリソースが役立つ場合があります。
作業項目を [実行中] に移動する
ここでは、Azure Boards で自分自身に作業項目を割り当てます。 また、作業項目を [実行中] の状態にします。 実際には、自分とチームが、各 "スプリント" (繰り返し作業) の最初に作業項目を作成することになります。
この作業割り当てによって、作業の起点となるチェックリストが得られます。 これにより、あなたの作業内容と残っている作業をチームの他のメンバーが把握できます。 また、作業項目は、チームがあまりに多くの作業を一度に引き受けることがないように、進行中の作業 (WIP) の制限を適用するのに役立ちます。
現在のスプリントでは、以下が優先課題であることをチームで決定したことを思い出してください。
Note
Azure DevOps 組織内では、作業項目に順番に番号が付けられます。 プロジェクトでは、各作業項目の番号が、ここに表示されるものと一致しない場合があります。
ここでは、最初の項目である [Create a multistage pipeline] を [実行中] 列に移動します。 その後、自分自身を作業項目に割り当てます。 [Create a multistage pipeline] は、Space Game Web サイトをデプロイする各ステージの定義に関係しています。
作業項目を設定するには、次のようにします。
Azure DevOps から、[Boards] に移動します。 次に、メニューから [Boards] を選択します。
[Create a multistage pipeline] カードで、下矢印を選択します。 その後、作業項目を自分自身に割り当てます。
作業項目を [作業予定] 列から [実行中] 列に移動します。
このモジュールの最後に、タスクの完了後、このカードを [完了] 列に移動します。
プロジェクトをローカルで設定する
ここでは、スタート コードをダウンロードできるように、Visual Studio Code への Space Game プロジェクトの読み込み、Git の構成、リポジトリのローカルへのクローン、アップストリーム リモートの設定を行います。
注意
既にローカルで mslearn-tailspin-spacegame-web-deploy プロジェクトを設定している場合は、次のセクションに進むことができます。
統合ターミナルを開く
Visual Studio Code には、統合ターミナルが付属しています。 ここでは、ファイルの編集とコマンドラインからの操作の両方を行います。
Visual Studio Code を起動します。
[View] メニューで、[Terminal] を選択します。
ドロップダウン リストで [Git Bash] を選びます。 慣れている Unix シェルが他にあり、そちらを使用する場合は、代わりにそのシェルを選択します。
ターミナル ウィンドウでは、システムにインストールされている任意のシェルを選択できます。 たとえば、Git Bash、PowerShell、または別のシェルを選択できます。
ここでは、Git for Windows に含まれる Git Bash を使用します。これにより、Git コマンドの実行が簡単になります。
Note
Windows で、Git Bash がオプションとして表示されない場合は、Git がインストール済みであることを確認してから、Visual Studio Code を再起動してください。
cdコマンドを実行して、作業場所にするディレクトリに移動します。 ホーム ディレクトリ (~)、または必要に応じて別のディレクトリを選択します。cd ~
Git を構成する
Git と GitHub を初めて使用する場合は、最初にいくつかのコマンドを実行して、自分の ID を Git に関連付け、GitHub で認証します。 詳細については、Git の設定に関するページを参照してください。
少なくとも、次の手順を完了する必要があります。 統合ターミナルからコマンドを実行します。
- ユーザー名を設定します。
- コミット メール アドレスを設定します。
- GitHub パスワードをキャッシュします。
注意
GitHub で既に 2 要素認証を使用している場合は、個人用アクセス トークンを作成します。 プロンプトが表示されたら、パスワードの代わりにトークンを使用します。
アクセス トークンは、パスワードと同様に扱います。 安全な場所に保管してください。
Visual Studio Code でプロジェクトを設定する
「Azure DevOps を使用してアプリケーションをビルドする」ラーニング パスでは、Git リポジトリをフォークしてからクローンしました。 リポジトリには、Space Game Web サイトのソース コードが含まれています。 フォークは Azure DevOps 内のプロジェクトに接続されており、変更を GitHub にプッシュするとビルドが実行されるようになっています。
重要
このラーニング パスでは、別の Git リポジトリ (mslearn-tailspin-spacegame-web-deploy) に切り替えます。 テンプレートを実行して Azure DevOps プロジェクトを設定したときに、プロセスによってリポジトリが自動的にフォークされました。
このパートでは、パイプライン構成を変更して構築できるように、フォークをローカルにクローンします。
フォークをローカルに複製する
ご自分の GitHub アカウントに Space Game Web プロジェクトのコピーが作成されています。 次に、コンピューターにコピーをダウンロード ("クローン") して作業できるようにします。
クローンは、フォークと同様にリポジトリのコピーです。 リポジトリをクローンしたら、変更を加え、予期したとおり機能することを確認してから、それらの変更を GitHub にアップロードすることができます。 ローカル コピーは、他の認証済みユーザーが、GitHub のご自分のリポジトリのコピーに対して行った変更と同期させることもできます。
Space Game Web プロジェクトをコンピューターにクローンするには、次のようにします。
GitHub にある Space Game Web プロジェクト (mslearn-tailspin-spacegame-web-deploy) のフォークにアクセスします。
[コード] を選択します。 次に、[HTTPS] タブで、URL を自分のクリップボードにコピーできるように表示されている URL の横のボタンを選択します。
Visual Studio Code で、ターミナル ウィンドウに移動します。
ターミナルで、作業場所のディレクトリに移動します。 ホーム ディレクトリ (
~)、または必要に応じて別のディレクトリを選択します。cd ~git cloneコマンドを実行します。 ここに表示されている URL をクリップボードの内容に置き換えます。git clone https://github.com/your-name/mslearn-tailspin-spacegame-web-deploy.gitmslearn-tailspin-spacegame-web-deployディレクトリに移動します。 これはリポジトリのルート ディレクトリです。cd mslearn-tailspin-spacegame-web-deploy
アップストリーム リモートを設定する
"リモート" とは、チーム メンバーが (GitHub のリポジトリのように) 共同作業する Git リポジトリです。 ここでは、リモートを一覧表示し、最新のサンプル コードを取得できるように、Microsoft のリポジトリのコピーを指すリモートを追加します。
次の
git remoteコマンドを実行して、自分のリモートを一覧表示します。git remote -vリポジトリに対してフェッチ (ダウンロード) とプッシュ (アップロード) の両方のアクセスがあることがわかります。
origin https://github.com/username/mslearn-tailspin-spacegame-web-deploy.git (fetch) origin https://github.com/username/mslearn-tailspin-spacegame-web-deploy.git (push)origin により、GitHub 上のリポジトリが明示されています。 別のリポジトリからコードをフォークする場合は、元のリモート (フォーク元) に「upstream」という名前を付けるのが一般的です。
次の
git remote addコマンドを実行して、Microsoft リポジトリを指す「upstream」という名前のリモートを作成します。git remote add upstream https://github.com/MicrosoftDocs/mslearn-tailspin-spacegame-web-deploy.gitもう一度
git remoteを実行して変更を確認します。git remote -vリポジトリに対して、まだフェッチ (ダウンロード) アクセスとプッシュ (アップロード) アクセスの両方があることがわかります。 今度は、Microsoft リポジトリへのフェッチ アクセスもあります。
origin https://github.com/username/mslearn-tailspin-spacegame-web-deploy.git (fetch) origin https://github.com/username/mslearn-tailspin-spacegame-web-deploy.git (push) upstream https://github.com/MicrosoftDocs/mslearn-tailspin-spacegame-web-deploy.git (fetch)
エクスプローラーでプロジェクトを開く
Visual Studio Code のターミナル ウィンドウは、Space Game Web プロジェクトのルート ディレクトリを指し示しています。 その構造を表示し、ファイルを操作するには、ファイル エクスプローラーから、ここでプロジェクトを開きます。
プロジェクトを開く最も簡単な方法は、現在のディレクトリで Visual Studio Code を再度開くことです。 これを行うには、統合ターミナルから次のコマンドを実行します。
code -r .エクスプローラーでディレクトリとファイル ツリーを確認します。
統合ターミナルをもう一度開きます。 ターミナルでは、ご使用の Web プロジェクトのルートに表示されます。
code コマンドが失敗した場合は、ご使用のシステム PATH に Visual Studio Code を追加する必要があります。 そのためには次を行います。
- Visual Studio Code で、[F1] を選択するか、[表示]>[コマンド パレット] を選択して、コマンド パレットにアクセスします。
- コマンド パレットで、「シェル コマンド:PATH 内に 'code' コマンドをインストールします」と入力します。
- 前の手順を繰り返して、ファイル エクスプローラーでプロジェクトを開きます。
これで、Space Game のソース コードと Azure Pipelines 構成をローカル開発環境から操作できるように設定されました。
Azure App Service 環境を作成する
ここでは、パイプラインのステージを定義する環境を作成します。 各ステージ ("開発"、"テスト"、"ステージング") に 1 つの App Service インスタンスを作成します。
Azure Pipelines でのリリース パイプラインの作成に関するモジュールでは、Azure portal を使用して App Service を開始しました。 ポータルは、Azure で利用できるものを調べたり、基本的なタスクを実行したりするには優れた方法ですが、App Service などのコンポーネントを導入するには面倒な場合があります。
このモジュールでは、Azure CLI を使用して 3 つの App Service インスタンスを表示します。 Azure CLI には、ターミナルまたは Visual Studio Code からアクセスできます。 ここでは、Azure Cloud Shell から Azure CLI にアクセスします。 このブラウザーベースのシェル エクスペリエンスは、クラウドでホストされています。 Cloud Shell では、Azure CLI は Azure サブスクリプションで使用するように構成されています。
重要
このモジュールの演習を完了するには、自分の Azure サブスクリプションが必要です。
Azure portal から Cloud Shell を起動する
Azure portal に移動してサインインします。
メニューから [Cloud Shell] を選択します。 プロンプトが表示されたら、[Bash] エクスペリエンスを選択します。
Note
Cloud Shell では、Cloud Shell で作成するすべてのファイルを保持する Azure ストレージ リソースが必要です。 ユーザーが Cloud Shell を初めて開くとき、リソース グループ、ストレージ アカウント、Azure Files 共有を作成するように求められます。 この設定は、以降のすべての Cloud Shell セッションで自動的に使用されます。
Azure リージョンを選択する
"リージョン" は、1 つの地理的な場所内にある 1 つ以上の Azure データセンターです。 米国東部、米国西部、北ヨーロッパなどがリージョンの例です。 App Service インスタンスなどのすべての Azure リソースには、リージョンが割り当てられています。
コマンドをより簡単に実行するには、まず、既定のリージョンを選択します。 既定のリージョンを指定すると、別のリージョンを指定しない限り、そのリージョンが以降のコマンドで使用されます。
Cloud Shell から次の
az account list-locationsコマンドを実行して、お使いの Azure サブスクリプションで使用可能なリージョンの一覧を表示します。az account list-locations \ --query "[].{Name: name, DisplayName: displayName}" \ --output table出力の
Name列から、最寄りのリージョンを選択します。 たとえば、eastasiaまたはwestus2を選択します。az configureを実行して、自分の既定のリージョンを設定します。<REGION>を、選択したリージョン名に置き換えます。az configure --defaults location=<REGION>この例では、既定のリージョンとして
westus2を設定します。az configure --defaults location=westus2
App Service インスタンスを作成する
ここでは、デプロイ先である次の 3 つのステージ用の App Service インスタンスを作成します: "開発"、"テスト"、"ステージング"。 だいたい次のようなプロセスで行います。
Web アプリのドメイン名を一意にするランダムな数値を生成します。
この手順は学習目的です。 実際には、アプリまたはサービスの名前と一致するドメイン名を選択します。
すべての App Service インスタンスを含むリソース グループを作成します。
学習目的のため、ここでは、すべての App Service インスタンスを含むリソース グループを 1 つ作成します。 実際には、各インスタンスのライフ サイクルをより適切に制御できるように、App Service インスタンスごとに個別のリソース グループを作成することができます。
Create an App Service plan.
App Service プランでは、Web アプリの CPU、メモリ、ストレージの各リソースを定義します。 ここでは、B1 Basic プランを使用します。 このプランは、トラフィック要件が低いアプリを対象としています。 Standard および Premium プランは、運用環境のワークロードに適しています。 これらのプランは、専用の仮想マシン インスタンスで実行されます。
"開発"、"テスト"、"ステージング" の各環境の App Service インスタンスを作成します。
各環境のホスト名を取得します。
各環境が実行されていること、およびホーム ページにアクセスできることを確認します。
Note
学習目的のため、ここでは、既定のネットワーク設定を使用します。 これらの設定により、インターネットからサイトにアクセスできるようになります。 実際には、インターネットでルーティングできず、自分のチームのみがアクセスできるネットワークに Web サイトを配置するように Azure 仮想ネットワークを構成できます。 後で自分のネットワークを再構成し、自分のユーザーが Web サイトを利用できるようにできます。
App Service インスタンスを作成するには、次の手順を実行します。
Cloud Shell から、Web アプリのドメイン名を一意にするランダムな数値を生成します。
webappsuffix=$RANDOMtailspin-space-game-rg という名前のリソース グループを作成するには、次の
az group createコマンドを実行します。az group create --name tailspin-space-game-rgtailspin-space-game-asp という名前の App Service プランを作成するには、次の
az appservice plan createコマンドを実行します。az appservice plan create \ --name tailspin-space-game-asp \ --resource-group tailspin-space-game-rg \ --sku B1 \ --is-linux--sku引数では、B1 プランを指定しています。 このプランは、Basic サービス レベルで実行されます。--is-linux引数では、Linux ワーカーを使用するよう指定しています。重要
お使いの Azure サブスクリプションで B1 SKU を使用できない場合は、S1 (Standard) などの別のプランを選択します。
各環境 ("開発"、"テスト"、"ステージング") に 1 つずつの 3 つの App Service インスタンスを作成するには、次の
az webapp createコマンドを実行します。az webapp create \ --name tailspin-space-game-web-dev-$webappsuffix \ --resource-group tailspin-space-game-rg \ --plan tailspin-space-game-asp \ --runtime "DOTNET|6.0" az webapp create \ --name tailspin-space-game-web-test-$webappsuffix \ --resource-group tailspin-space-game-rg \ --plan tailspin-space-game-asp \ --runtime "DOTNET|6.0" az webapp create \ --name tailspin-space-game-web-staging-$webappsuffix \ --resource-group tailspin-space-game-rg \ --plan tailspin-space-game-asp \ --runtime "DOTNET|6.0"学習目的のため、ここでは、各 App Service インスタンスに同じ App Service プラン (B1 Basic) を適用します。 実際は、予測されるワークロードに一致するプランを割り当てます。
たとえば、"開発" と "テスト" のステージにマップされている環境では、自分のチームのみがその環境にアクセスするようにしたいため、B1 Basic が適している場合があります。
"ステージング" 環境には、運用環境に対応するプランを選択します。 そのプランでは、CPU、メモリ、ストレージの各リソースがより多く提供されるでしょう。 このプランでは、運用環境に似た環境で、ロード テストなどのパフォーマンス テストを実行できます。 サイトへのライブ トラフィックに影響を与えることなく、テストを実行できます。
各 App Service インスタンスのホスト名と状態を一覧表示するには、次の
az webapp listコマンドを実行します。az webapp list \ --resource-group tailspin-space-game-rg \ --query "[].{hostName: defaultHostName, state: state}" \ --output table実行中の各サービスのホスト名をメモしておきます。 これらのホスト名は、後で作業を確認するときに必要になります。 次に例を示します。
HostName State ------------------------------------------------------- ------- tailspin-space-game-web-dev-21017.azurewebsites.net Running tailspin-space-game-web-test-21017.azurewebsites.net Running tailspin-space-game-web-staging-21017.azurewebsites.net Running省略可能な手順として、1 つまたは複数のホスト名にアクセスします。 これらが実行されていることと、既定のホーム ページが表示されることを確認します。
次のようなページが表示されます。
重要
このモジュールの「Azure DevOps 環境をクリーンアップする」ページには、重要なクリーンアップ手順が含まれています。 クリーンアップは、このモジュールを完了した後に Azure リソースに対して課金されないようにするために役立ちます。 このモジュールを最後まで実行しなかったとしても、クリーンアップ手順は必ず行ってください。
Azure Pipelines でパイプライン変数を作成する
Azure Pipelines でのリリース パイプラインの作成に関するモジュールでは、App Service の Web アプリの名前を格納する変数をパイプラインに追加しました。 ここでも同じことを行います。 ただし、ここでは、パイプラインの "開発"、"テスト"、または "ステージング" の各ステージに対応する App Service インスタンスごとに 1 つの変数を追加します。
これらの名前は、パイプライン構成でハードコーディングできますが、変数として定義すると、構成を再利用しやすくなります。 さらに、App Service インスタンスの名前を変更する場合は、構成を変更することなく、変数を更新してパイプラインをトリガーできます。
変数を追加するには、次の手順に従います。
Azure DevOps で、Space Game - web - Multistage プロジェクトに移動します。
[パイプライン] で [ライブラリ] を選択します。
[+ Variable group] を選択します。
[Properties] の下で、変数グループ名として「Release」と入力します。
[Variables] で、[+ Add] を選択します。
変数の名前として「WebAppNameDev」を入力します。 その値として、"開発" 環境に対応する App Service インスタンスの名前 (tailspin-space-game-web-dev-1234 など) を入力します。
前の 2 つの手順を 2 回繰り返して、"テスト" 環境と "ステージング" 環境の変数を作成します。 以下に例を示します。
変数名 値の例 WebAppNameTest tailspin-space-game-web-test-1234 WebAppNameStaging tailspin-space-game-web-staging-1234 各例の値は、必ず実際の環境に対応する App Service インスタンスに置き換えてください。
重要
ホスト名ではなく、App Service インスタンスの名前を設定します。 この例では、「tailspin-space-game-web-dev-1234.azurewebsites.net」ではなく、「tailspin-space-game-web-dev-1234」と入力します。
ページの先頭近くにある [保存] を選択して、変数をパイプラインに保存します。
変数グループは次のようになります。
開発環境とテスト環境を作成する
「Azure Pipelines にリリース パイプラインを作成する」では、開発環境用の環境を作成しました。 ここでは、開発環境とテスト環境の両方に対してプロセスを繰り返します。 後で、さらに多くの条件が含まれるステージング環境を設定します。
開発環境とテスト環境を作成するには、次の手順に従います。
Azure Pipelines で、[Environments] を選択します。
dev 環境を作成するには:
- [環境の作成] を選択します。
- [名前] に「dev」と入力します。
- 残りのフィールドは既定値のままにします。
- ［作成］ を選択します
test 環境を作成するには:
- [環境] ページに戻ります。
- [New environment] (新しい環境) を選択します。
- [名前] に「test」と入力します。
- [作成] を選択します。
サービス接続を作成する
ここでは、Azure Pipelines で Azure サブスクリプションにアクセスできるようにするサービス接続を作成します。 Azure Pipelines では、このサービス接続を使用して Web サイトを App Service にデプロイします。 前のモジュールで同様のサービス接続を作成しました。
重要
同じ Microsoft アカウントで Azure portal と Azure DevOps の両方にサインインしていることを確認してください。
Azure DevOps で、Space Game - web - Multistage プロジェクトに移動します。
ページの左下隅にある [プロジェクトの設定] を選択します。
[パイプライン] で、[サービス接続] を選択します。
[New service connection] を選択してから、[Azure Resource Manager] を選択し、[Next] を選択します。
ページの先頭で、[サービス プリンシパル (自動)] を選択します。 次に、 [次へ] を選択します。
以下のフィールドを設定します。
フィールド 値 スコープのレベル サブスクリプション サブスクリプション お使いの Azure サブスクリプション リソース グループ tailspin-space-game-rg サービス接続名 Resource Manager - Tailspin - Space Game 処理中に、Microsoft アカウントにサインインするように求められる場合があります。
[すべてのパイプラインへのアクセス許可を与える] がオンになっていることを確認します。
[保存] を選択します。
Azure サブスクリプションに接続できることを確認するために、Azure DevOps でテスト接続が実行されます。 Azure DevOps で接続できない場合は、もう一度サインインする機会があります。