GitHub のアクションと Azure Kubernetes Service (プレビュー)GitHub Actions & Azure Kubernetes Service (preview)

Azure Dev Spaces は、プル要求がリポジトリのメイン ブランチに結合される前に、プル要求からの変更を AKS で直接テストできる GitHub のアクションを使用してワークフローを提供しています。Azure Dev Spaces provides a workflow using GitHub Actions that allows you to test changes from a pull request directly in AKS before the pull request is merged into your repository’s main branch. 実行中のアプリケーションを用意してプル要求の変更を確認することで、開発者とチーム メンバーの両方の信頼度を高めることができます。Having a running application to review changes of a pull request can increase the confidence of both the developer as well as team members. この実行中のアプリケーションは、製品マネージャーやデザイナーなどのチーム メンバーが、開発の初期段階の間にレビュー プロセスの一部となることにも貢献できます。This running application can also help team members such as, product managers and designers, become part of the review process during early stages of development.

このガイドでは、以下の方法について説明します。In this guide, you will learn how to:

  • Azure のマネージド Kubernetes クラスターで Azure Dev Spaces をセットアップする。Set up Azure Dev Spaces on a managed Kubernetes cluster in Azure.
  • 複数のマイクロサービスを伴う大規模アプリケーションを開発空間にデプロイする。Deploy a large application with multiple microservices to a dev space.
  • GitHub アクションを使用して CI/CD を設定する。Set up CI/CD with GitHub actions.
  • 完全なアプリケーションのコンテキスト内の分離開発空間で単一のマイクロサービスをテストする。Test a single microservice in an isolated dev space within the context of the full application.

重要

現在、この機能はプレビュー段階にあります。This feature is currently in preview. プレビュー版は、追加使用条件に同意することを条件に使用できます。Previews are made available to you on the condition that you agree to the supplemental terms of use. この機能の一部の側面は、一般公開 (GA) 前に変更される可能性があります。Some aspects of this feature may change prior to general availability (GA).

前提条件Prerequisites

Azure Container Registry を作成するCreate an Azure Container Registry

Azure Container Registry (ACR) を作成します。Create an Azure Container Registry (ACR):

az acr create --resource-group MyResourceGroup --name <acrName> --sku Basic

重要

ACR の名前は Azure 内で一意にする必要があり、英数字で 5 ~ 50 文字にする必要があります。The name your ACR must be unique within Azure and contain 5-50 alphanumeric characters. 使用する文字はすべて小文字にする必要があります。Any letters you use must be lower case.

後の手順で使用されるため、出力の loginServer の値を保存します。Save the loginServer value from the output because it is used in a later step.

認証用のサービス プリンシパルを作成するCreate a service principal for authentication

az ad sp create-for-rbac を使用してサービス プリンシパルを作成します。Use az ad sp create-for-rbac to create a service principal. 次に例を示します。For example:

az ad sp create-for-rbac --sdk-auth --skip-assignment

JSON 出力は、後の手順で使用されるため保存します。Save the JSON output because it is used in a later step.

az aks show を使用して、AKS クラスターの id を表示します。Use az aks show to display the id of your AKS cluster:

az aks show -g MyResourceGroup -n MyAKS  --query id

az acr show を使用して、ACR クラスターの id を表示します。Use az acr show to display the id of the ACR:

az acr show --name <acrName> --query id

az role assignment create を使用して、AKS クラスターへの共同作成者アクセスと、ACR への AcrPush アクセスを付与します。Use az role assignment create to give Contributor access to your AKS cluster and AcrPush access to your ACR.

az role assignment create --assignee <ClientId> --scope <AKSId> --role Contributor
az role assignment create --assignee <ClientId>  --scope <ACRId> --role AcrPush

重要

それらのリソースへのサービス プリンシパルのアクセスを付与するには、AKS クラスターと ACR の両方の所有者である必要があります。You must be the owner of both your AKS cluster and ACR in order to give your service principal access to those resources.

GitHub アクションを構成するConfigure your GitHub action

重要

リポジトリに対して GitHub アクションが有効になっている必要があります。You must have GitHub Actions enabled for your repository. リポジトリに対して GitHub アクションを有効にするには、GitHub 上のリポジトリに移動し、[アクション] タブをクリックして、このリポジトリに対するアクションを有効にすることを選択します。To enable GitHub Actions for your repository, navigate to your repository on GitHub, click on the Actions tab, and choose to enable actions for this repository.

フォークされたリポジトリに移動し、 [設定] をクリックします。Navigate to your forked repository and click Settings. 左側のサイドバーの [シークレット] をクリックします。Click on Secrets in the left sidebar. [Add a new secret] (新しいシークレットの追加) をクリックして、下記の新しいシークレットをそれぞれ追加します。Click Add a new secret to add each new secret below:

  1. AZURE_CREDENTIALS: サービス プリンシパルの作成からの出力全体。AZURE_CREDENTIALS: the entire output from the service principal creation.
  2. RESOURCE_GROUP: AKS クラスターのリソース グループ。この例では、MyResourceGroup です。RESOURCE_GROUP: the resource group for your AKS cluster, which in this example is MyResourceGroup.
  3. CLUSTER_NAME: AKS クラスターの名前。この例では MyAKS です。CLUSTER_NAME: the name of your AKS cluster, which in this example is MyAKS.
  4. CONTAINER_REGISTRY: ACR 用の loginServerCONTAINER_REGISTRY: the loginServer for the ACR.
  5. HOST: 開発空間用のホスト。 <MASTER_SPACE>.<APP_NAME>.<HOST_SUFFIX> の形式となります。この例では、dev.bikesharingweb.fedcab0987.eus.azds.io です。HOST: the host for your Dev Space, which takes the form <MASTER_SPACE>.<APP_NAME>.<HOST_SUFFIX>, which in this example is dev.bikesharingweb.fedcab0987.eus.azds.io.
  6. HOST_SUFFIX: 開発空間用のホストのサフィックス。この例では fedcab0987.eus.azds.io です。HOST_SUFFIX: the host suffix for your Dev Space, which in this example is fedcab0987.eus.azds.io.
  7. IMAGE_PULL_SECRET: 使用するシークレットの名前。demo-secret などです。IMAGE_PULL_SECRET: the name of the secret you wish to use, for example demo-secret.
  8. MASTER_SPACE: 親の開発空間の名前。この例では dev です。MASTER_SPACE: the name of your parent Dev Space, which in this example is dev.
  9. REGISTRY_USERNAME: サービス プリンシパル作成の JSON 出力に含まれる clientId です。REGISTRY_USERNAME: the clientId from the JSON output from the service principal creation.
  10. REGISTRY_PASSWORD: サービス プリンシパル作成の JSON 出力に含まれる clientSecret です。REGISTRY_PASSWORD: the clientSecret from the JSON output from the service principal creation.

注意

これらのシークレットはすべて GitHub アクションによって使用され、.github/workflows/bikes.yml 内で構成されます。All of these secrets are used by the GitHub action and are configured in .github/workflows/bikes.yml.

コード変更用の新しいブランチを作成するCreate a new branch for code changes

BikeSharingApp/ に移動し、bike-images という新しいブランチを作成します。Navigate to BikeSharingApp/ and create a new branch called bike-images.

cd dev-spaces/samples/BikeSharingApp/
git checkout -b bike-images

Bikes/server.js を編集し、232 行と 233 行を削除します。Edit Bikes/server.js to remove lines 232 and 233:

    // Hard code image url *FIX ME*
    theBike.imageUrl = "/static/logo.svg";

これでセクションは、次のようになります。The section should now look like:

    var theBike = result;
    theBike.id = theBike._id;
    delete theBike._id;

ファイルを保存してから、git addgit commit を使用して変更をステージングします。Save the file then use git add and git commit to stage your changes.

git add Bikes/server.js 
git commit -m "Removing hard coded imageUrl from /bikes/:id route"

変更をプッシュするPush your changes

git push を使用して、フォークされたリポジトリに新しいブランチをプッシュします。Use git push to push your new branch to your forked repository:

git push origin bike-images

プッシュが完了したら、GitHub でフォークされたリポジトリに移動し、bike-images ブランチと比較される基本ブランチとして、フォークされたリポジトリの master ブランチを使用してプル要求を作成します。After the push is complete, navigate to your forked repository on GitHub to create a pull request with the master branch in your forked repository as the base branch compared to the bike-images branch.

プル要求が開かれたら、 [アクション] タブに移動します。新しいアクションが開始され、Bikes サービスを構築中であることを確認します。After your pull request is opened, navigate to the Actions tab. Verify a new action has started and is building the Bikes service.

変更を含む子空間を表示するView the child space with your changes

アクションが完了すると、プル要求に含まれる変更に基づいて、新しい子空間への URL を含むコメントが表示されます。After the action has completed, you will see a comment with a URL to your new child space based the changes in the pull request.

GitHub アクションの UrlGitHub Action Url

コメントから URL を開いて bikesharingweb サービスに移動します。Navigate to the bikesharingweb service by opening the URL from the comment. ユーザーとして Aurelia Briggs (顧客) を選択してから、借りる自転車を選択します。Select Aurelia Briggs (customer) as the user, then select a bike to rent. 自転車のプレースホルダー画像が表示されなくなっていることを確認します。Verify you no longer see the placeholder image for the bike.

変更をフォークの master ブランチにマージすると、別のアクションが実行され、親の開発空間でアプリケーション全体がリビルドされ、実行されます。If you merge your changes into the master branch in your fork, another action will run to rebuild and run your entire application in the parent dev space. この例では、親空間は dev です。In this example, the parent space is dev. このアクションは .github/workflows/bikesharing.yml 内で構成されています。This action is configured in .github/workflows/bikesharing.yml.

Azure リソースをクリーンアップするClean up your Azure resources

az group delete --name MyResourceGroup --yes --no-wait

次のステップNext steps

Azure Dev Spaces を使用して複数のコンテナーにまたがるより複雑なアプリケーションを開発する方法と、別の空間で別のバージョンまたは分岐を使用して作業することによって共同開発を簡略化する方法について学習します。Learn how Azure Dev Spaces helps you develop more complex applications across multiple containers, and how you can simplify collaborative development by working with different versions or branches of your code in different spaces.