演習 - Azure DevOps 環境を設定する

  • 8 分

このユニットでは、このモジュールの残りの部分を完了するために、Microsoft Azure DevOps 組織が確実に設定されるようにします。

これを行うには、次を実行します。

  • このモジュール用の Azure DevOps プロジェクトを設定します。
  • Azure Boards のこのモジュールの作業項目を [ 実行 ] 列に移動します。
  • 変更をパイプラインにプッシュできるように、ローカルでプロジェクトが設定されていることを確認します。

Azure DevOps プロジェクトを取得する

ここでは、このモジュールの残りの部分を完了するために、Azure DevOps 組織が確実に設定されるようにします。 これを行うには、Azure DevOps で自動的にプロジェクトを作成するテンプレートを実行します。

このラーニング パスのモジュールでは、Tailspin Web チームの DevOps 体験を踏襲する段階的なプロセスになっています。 学習目的のために、各モジュールには Azure DevOps プロジェクトが関連付けられています。

テンプレートの実行

Azure DevOps 組織を設定するテンプレートを実行します。

  1. Visual Studio または選択した IDE で ADOGenerator プロジェクトを取得して実行します。

  2. テンプレートの一覧からテンプレート番号を入力するように求められたら、「Git と GitHub を使用してビルド パイプラインにコード ワークフローを実装する」に「23」と入力し、Enter キーを押します。

  3. 認証方法を選択します。 個人用アクセス トークン (PAT) を設定して使用することも、デバイス ログインを使用することもできます。

    注意

    PAT を設定する場合は、必ず必要なスコープを承認 してください。 このモジュールではフル アクセスを使用できますが、実際の状況では、必要なスコープのみを付与する必要があります。

  4. Azure DevOps 組織名を入力し、 Enter キーを押します。

  5. メッセージが表示されたら、Azure DevOps PAT を入力し、 Enter キーを押します。

  6. Space Game - Web - Workflow などのプロジェクト名を入力し、Enter キーを押します。

  7. プロジェクトが作成されたら、ブラウザー ( https://dev.azure.com/<your-organization-name>/) で Azure DevOps 組織に移動し、プロジェクトを選択します。

重要

このモジュールの [Azure DevOps 環境のクリーンアップ ] ページには、重要なクリーンアップ手順が含まれています。 クリーンアップによって、無料のビルド時間の浪費を抑えることができます。 このモジュールを最後まで実行しなかったとしても、クリーンアップ手順は必ず行ってください。

リポジトリのフォーク

まだ行っていない場合は、 mslearn-tailspin-spacegame-web リポジトリをフォークします。

  1. GitHub で、 mslearn-tailspin-spacegame-web リポジトリに移動します。

  2. 画面の右上にある [フォーク ] を選択します。

  3. 所有者として GitHub アカウントを選択し、[フォークの作成] を選択します。

プロジェクトの可視性を設定する

最初は、GitHub 上の Space Game リポジトリのフォークはパブリックに設定され、Azure DevOps テンプレートによって作成されたプロジェクトはプライベートに設定されます。 GitHub 上のパブリック リポジトリには誰でもアクセスできますが、プライベート リポジトリには自分のほかに共有することを選択したユーザーのみがアクセスできます。 同様に、Azure DevOps では、パブリック プロジェクトでは認証されていないユーザーに読み取り専用アクセスを提供しますが、プライベート プロジェクトではユーザーがサービスにアクセスするにはアクセス権の付与と認証が必要です。

現時点では、このモジュールにおいてこれらの設定を変更する必要はありません。 ただし、個人のプロジェクトでは、他のユーザーに付与する可視性とアクセス権を決定する必要があります。 たとえば、プロジェクトがオープンソースの場合は、GitHub リポジトリと Azure DevOps プロジェクトの両方をパブリックにすることを選択できます。 プロジェクトが独自のものである場合は、GitHub リポジトリと Azure DevOps プロジェクトの両方をプライベートにするのが一般的です。

後で、プロジェクトに最適なオプションを決定する際に、次のリソースが役立つ場合があります。

作業項目を [実行中] に移動する

このセクションでは、Azure Boards でこのモジュールに関連する作業項目を自分自身に割り当てます。 また、作業項目を [実行 中] 状態に移動します。 実際には、あなたとチームは、各スプリントまたは作業イテレーションの開始時に作業項目を作成します。

このように作業を割り当てることで、作業の起点となるチェックリストが得られます。 これにより、あなたの作業内容と残っている作業をチームの他のメンバーが把握できます。 また、チームがあまりに多くの作業を一度に引き受けることがないように、進行中の作業 (WIP) の制限を適用するのに役立ちます。

チームは以下の上位 7 つの問題を解決したことを思い出してください。

問題のバックログを示す Azure Boards のスクリーンショット。

注意

Azure DevOps 組織内では、作業項目に順番に番号が付けられます。 自分のプロジェクトで、各作業項目に割り当てられた番号が、ここに表示されるものと一致しない場合があります。

ここでは、2 番目の項目である Git ベースのワークフローの作成を [ 実行 ] 列に移動し、自分を作業項目に割り当てます。

Git ベースのワークフローの作成は、チーム メンバー間のコラボレーションを向上させるコード ワークフローへの移行に関連していることを思い出してください。

Git ベースのワークフローの作成に関する問題の作業項目の詳細を示す Azure Boards のスクリーンショット。

作業項目を設定するには、次のようにします。

  1. Azure DevOps で、左側のウィンドウで [Boards ] を選択し、[ Boards] を選択します。

    [Boards] メニューの場所を示す Azure DevOps のスクリーンショット。

  2. [ Git ベースのワークフロー作業項目の作成 ] で、[ To Do ] 下矢印を選択し、作業項目を自分に割り当てます。

    下矢印の場所を示す Azure Boards のスクリーンショット。

  3. 作業項目を [ To Do ] 列から [ 実行 ] 列にドラッグします。

    [実行中] 列に作業項目が表示されている Azure Boards のスクリーンショット。

このモジュールの最後に、タスクが完了したら、項目を [完了] 列に移動します。

プロジェクトをローカルで設定する

ここでは、Visual Studio Code で Space Game プロジェクトを読み込み、Git を構成し、リポジトリをローカルに複製して、スターター コードをダウンロードできるようにアップストリーム リモートを設定します。

注意

mslearn-tailspin-spacegame-web プロジェクトをローカルで既に設定している場合は、次のセクションに進むことができます。

統合ターミナルを開く

Visual Studio Code には統合ターミナルが付属しており、ファイルの編集とコマンド ラインからの操作をすべて 1 か所で行うことができます。

  1. Visual Studio Code を起動します。

  2. [ 表示 ] メニューの [ ターミナル] を選択します。

  3. ドロップダウン リストで、 bash を選択します。 Zsh など、慣れている Unix シェルが他にあり、そちらを使用する場合は、代わりにそのシェルを選択します。

    Bash シェルの場所を示す Visual Studio Code のスクリーンショット。

    ターミナル ウィンドウでは、Bash、Zsh、PowerShell など、システムにインストールされている任意のシェルを選択できます。

    ここでは、Bash を使用します。 Git for Windows には、Git コマンドを簡単に実行できる Git Bash が用意されています。

    注意

    Windows では、 オプションとして Git Bash が表示されない場合は、 Git がインストールされていることを確認してから、Visual Studio Code を再起動します。

  4. cd コマンドを実行して、ホーム ディレクトリ (~) など、作業するディレクトリに移動します。 必要に応じて、別のディレクトリを選択できます。

    cd ~

Git を構成する

Git と GitHub を初めて使用する場合は、最初にいくつかのコマンドを実行して、自分の ID を Git に関連付け、GitHub で認証する必要があります。

Git をセットアップ すると、プロセスの詳細が説明されます。

少なくとも、次の手順を完了する必要があります。 統合ターミナルから次のコマンドを実行します。

  1. ユーザー名を設定します。
  2. コミット電子メール アドレスを設定します。
  3. GitHub パスワードをキャッシュします。

注意

GitHub で既に 2 要素認証を使用している場合は、 個人用アクセス トークンを作成 し、後でメッセージが表示されたときにパスワードの代わりにトークンを使用します。

アクセス トークンは、パスワードと同様に扱います。 安全な場所に保管してください。

Visual Studio Code でプロジェクトを設定する

このパートでは、フォークをローカルにクローンして、変更を加えてパイプライン構成を構築できるようにします。

注意

リポジトリを複製するときにファイル名が長すぎるというエラーが発生した場合は、長い名前を持たない、または深く入れ子になっていないフォルダーでリポジトリを複製してみてください。

フォークをローカルに複製する

これで、GitHub アカウントに Space Game Web プロジェクトのコピーが作成されました。 次に、コンピューターにコピーをダウンロードまたは 複製して、操作できるようにします。

クローンは、フォークと同様にリポジトリのコピーです。 リポジトリをクローンしたら、変更を加え、予期したとおり機能することを確認してから、それらの変更を GitHub にアップロードすることができます。 ローカル コピーは、他の認証済みユーザーが、GitHub のご自分のリポジトリのコピーに対して行った変更と同期させることもできます。

Space Game Web プロジェクトをコンピューターに複製するには:

  1. GitHub の Space Game Web プロジェクト (mslearn-tailspin-spacegame-web) のフォークに移動します。

  2. [コード] を選択します。 次に、[ HTTPS ] タブで、表示されている URL の横にあるボタンを選択して、URL をクリップボードにコピーします。

    GitHub リポジトリから URL とコピー ボタンを見つける。

  3. Visual Studio Code で、ターミナル ウィンドウに移動します。

  4. ターミナルで、ホーム ディレクトリ (~) など、作業するディレクトリに移動します。 必要に応じて、別のディレクトリを選択できます。

    cd ~

  5. git clone コマンドを実行します。 ここに表示されている URL をクリップボードの内容に置き換えます。

    git clone https://github.com/your-name/mslearn-tailspin-spacegame-web.git

  6. mslearn-tailspin-spacegame-web ディレクトリに移動します。 これはリポジトリのルート ディレクトリです。

    cd mslearn-tailspin-spacegame-web

アップストリーム リモートを設定する

リモートは、チーム メンバーが共同作業を行う Git リポジトリです (GitHub のリポジトリなど)。 ここでは、リモートを一覧表示し、最新のサンプル コードを取得できるように、Microsoft のリポジトリのコピーを指すリモートを追加します。

  1. 次の git remote コマンドを実行して、自分のリモートを一覧表示します。

    git remote -v

    リポジトリに対してフェッチ (ダウンロード) とプッシュ (アップロード) の両方のアクセスがあることがわかります。

    origin  https://github.com/username/mslearn-tailspin-spacegame-web.git (fetch)
origin  https://github.com/username/mslearn-tailspin-spacegame-web.git (push)

    Origin では、GitHub 上のリポジトリを指定します。 別のリポジトリからコードをフォークするときは、元のリモート (フォーク元のリモート) にアップストリームとして名前を付けるのが一般的 です。

  2. 次の git remote add コマンドを実行して、Microsoft リポジトリを指す アップストリーム という名前のリモートを作成します。

    git remote add upstream https://github.com/MicrosoftDocs/mslearn-tailspin-spacegame-web.git

  3. もう一度 git remote を実行して変更を確認します。

    git remote -v

    リポジトリに対するフェッチ (ダウンロード) とプッシュ (アップロード) の両方のアクセスがまだあることがわかります。 今度は、Microsoft リポジトリへのフェッチおよびプッシュ アクセスもあります。

    origin  https://github.com/username/mslearn-tailspin-spacegame-web.git (fetch)
origin  https://github.com/username/mslearn-tailspin-spacegame-web.git (push)
upstream        https://github.com/MicrosoftDocs/mslearn-tailspin-spacegame-web.git (fetch)
upstream        https://github.com/MicrosoftDocs/mslearn-tailspin-spacegame-web.git (push)

エクスプローラーでプロジェクトを開く

Visual Studio Code では、ターミナル ウィンドウは Space Game Web プロジェクトのルート ディレクトリを指します。 その構造を表示し、ファイルを操作するには、ファイル エクスプローラーから、ここでプロジェクトを開きます。

  1. プロジェクトを開く最も簡単な方法は、現在のディレクトリで Visual Studio Code を再度開くことです。 これを行うには、統合ターミナルから次のコマンドを実行します。

    code -r .

    エクスプローラーでディレクトリとファイル ツリーを確認します。

  2. 統合ターミナルをもう一度開きます。 ターミナルでは、ご使用の Web プロジェクトのルートに表示されます。

code コマンドが失敗した場合は、ご使用のシステム PATH に Visual Studio Code を追加する必要があります。 そのためには次を行います。

  1. Visual Studio Code で F1 キーを押すか、[ 表示>コマンド パレット ] を選択してコマンド パレットにアクセスします。
  2. コマンド パレットで、「 シェル コマンド: PATH に 'code' コマンドをインストールする」と入力します。
  3. 前の手順を繰り返して、ファイル エクスプローラーでプロジェクトを開きます。

これで、ローカル開発環境から Space Game のソース コードと Azure Pipelines 構成を操作するように設定されました。