GitHub Actions と Azure PaaS でプルリクエストごとに環境を ～ Azure Static Web Apps と Container Apps

「エキスパートが語る！開発を加速するGitHub x Azure 最新開発ベストプラクティス Vol.2 GitHub Actions編」でお話した資料です。
https://info.microsoft.com/ja-devops-catalog-fy23-01jan-13-expert-speaks-github-x-azure-latest-development-best-practices-for-accelerating-development-vol-2-github-srdem132702_catalog-display-page.html

Transcript

1. GitHub Actions と Azure
   PaaS でプルリクエストごとに
   環境を ～ Azure Static Web
   Apps と Container Apps
   開発を加速するGitHub x Azure 最新開発ベストプラクティス
   vol.2
   

   View Slide

2. 岩永かづみ / Kazumi IWANAGA
   • Microsoft MVP for Azure
   • ZEN Architects 所属
   • GitHub公認トレーナー
   • 得意な領域
   • Infrastructure as Code
   • GitHub Actions による自動化
   • 技術コミュニティ
   • Code Polaris / Hack Everything.
   • @dz_
   • @dzeyelid
   • @dzeyelid
   

   View Slide

3. CI/CD
   

   View Slide

4. CI/CD すでに構築済みの方も多いですよね
   本番
   ステージング
   main
   staging
   

   View Slide

5. ステージング環境のCI/CD
   

   View Slide

6. ステージング環境はどうでしょう？
   本番
   ステージング
   main
   staging
   

   View Slide

7. ステージング環境は十分？
   本番
   ステージング
   main
   featureA
   

   View Slide

8. ステージング環境は十分？
   本番
   ステージング
   main
   featureA
   featureB
   

   View Slide

9. ステージング環境は十分？
   本番
   ステージング
   main
   featureA
   featureB
   

   View Slide

10. ステージング環境は十分？
    本番
    ステージング
    main
    featureA
    featureB
    他のプルリクエストの更新で上書きされたり、
    いつのプルリクエストの環境かわからなくなったり…
    

    View Slide

11. プルリクエストごとの環境で
    より便利に✨
    

    View Slide

12. プルリクエストごとに環境があったら便利！
    本番
    featureA
    main
    featureA
    featureB
    featureB
    

    View Slide

13. CI/CD をプルリクエストにも活用しよう！
    

    View Slide

14. GitHub Actions なら
    プルリクエストとの連携がシームレス
    

    View Slide

15. GitHub Actions 基礎
    

    View Slide

16. GitHub Actions 概要
    • GitHub と連動したワークフローを構築できる
    • 受け付けられるイベントが豊富
    • push, pull_request, release, workflow_dispatch（手動/API実行）…
    • 公開されている「アクション」を利用できる
    • Marketplace
    • パブリックリポジトリ（組織内リポジトリも可能）
    • アクションの自作もできる
    • JavaScript、またはDocker コンテナ
    

    View Slide

17. GitHub Actions ワークフロー概要(1)
    • on:
    • 受け付けるイベントを指定する
    • jobs:
    • 後述の steps をまとめる単位
    • 個々にランナーが割り当てられる
    • 並列に実行、依存関係を指定した順次実行もできる
    • steps:
    • アクションを実行する、またはシェルコマンドを実行する
    

    View Slide

18. GitHub Actions ワークフロー概要(2)
    

    View Slide

19. GitHub Actions ワークフロー概要(3)
    • シークレットや変数を定義してワークフロー内で利用できる
    • 条件分岐ができる
    • ワークフローを再利用できる（ワークフローから呼び出せるワークフ
    ローを作成できる）
    • Environments for deployment でシークレットや変数を切り替え
    たり、人による許可を要求（ゲート）を設けることができる
    • 用途に応じたランナーを選択できる
    • GitHub ホステッド ランナー（Ubuntu, Windows Server, macOS）
    • セルフ ホステッド ランナー
    

    View Slide

20. GitHub Actions のメリット
    • コードを置いてあるリポジトリへのアクセスなど、認証を統一できる
    • 無料枠が多め
    • 豊富なアクション
    • プルリクエストとの親和性の高さ◎
    

    View Slide

21. 参考(1)
    • GitHub Actions を理解する - GitHub Docs
    • GitHub Actions の重要な機能 - GitHub Docs
    • 式 - GitHub Docs
    • コンテキスト - GitHub Docs
    • Variables - GitHub Docs
    • ワークフローをトリガーするイベント - GitHub Docs
    • Workflow syntax for GitHub Actions - GitHub Docs
    • GitHub Actions のワークフロー コマンド - GitHub Docs
    

    View Slide

22. 参考(2)
    • Go でのビルドとテスト - GitHub Docs
    • Java
    • Ant / Gradle / Maven
    • .NETでのビルドとテスト - GitHub Docs
    • Node.js のビルドとテスト - GitHub Docs
    • Python のビルドとテスト - GitHub Docs
    • Rubyでのビルドとテスト - GitHub Docs
    • Swift のビルドとテスト - GitHub Docs
    • Xamarin アプリケーションのビルドとテスト - GitHub Docs
    

    View Slide

23. 参考(3)
    • Azure へのデプロイ - GitHub Docs
    • OpenID Connect を使ったセキュリティ強化について - GitHub
    Docs
    • GitHub ホステッド ランナーの概要 - GitHub Docs
    • セルフホステッド ランナーの概要 - GitHub Docs
    • カスタム アクションについて - GitHub Docs
    • GitHub Actions Importer を使用した移行の自動化 - GitHub
    Docs
    

    View Slide

24. Azure の公式アクション紹介
    

    View Slide

25. GitHub Marketplace
    Actions & Verified Creator
    "azure" 検索🔍
    

    View Slide

26. よく使うおすすめ Azure 関連アクション
    • Azure/login
    • Azure/cli
    • Azure/arm-deploy
    • Azure/functions-action
    • Azure/webapps-deploy
    • Azure/static-web-apps-deploy
    • Azure/container-apps-deploy-action
    • Azure/aca-review-apps
    （かづみ個人調べ）
    

    View Slide

27. Azure/login アクション
    • Azure にアクセスするときは基本使う
    • az login が実行される
    • Az PowerShell モジュールに切替えも可能
    • 認証方法
    • サービス プリンシパル（Service principal）
    • OpenID Connect (OIDC) ← おすすめ💡
    ユーティリティ
    

    View Slide

28. OpenID Connect による認証について
    • Azure では、ロールベースの制御（RBAC）としてサービス プリンシ
    パルなどを利用する認証が主流ですが、OpenID Connect を利用
    することでさらに安全に利用することができる
    • シークレットの扱いが不要になる（有効期間が短いアクセス トークンを都度発
    行、利用する）
    • 認証と認可の管理を明確に行える
    • 資格情報のローテーションが行われる（ジョブごと）
    

    View Slide

29. Azure/cli アクション
    • GitHub ホステッド ランナーに Azure CLI はインストールされている
    • バージョン指定したいときや、セルフ ホステッド ランナーを利用すると
    きに便利
    ユーティリティ
    

    View Slide

30. Azure/arm-deploy アクション
    • ARM template や Bicep でデプロイをするときに便利
    ユーティリティ
    

    View Slide

31. Azure/functions-action アクション
    • Azure Functions へのデプロイを行う
    • コードを zip 圧縮して WEBSITE_RUN_FROM_PACKAGE でデ
    プロイしてくれる
    • zip 圧縮の手間が省けて使いやすい
    • スロット指定や、pom.xml の利用、Kudu pre-deployment の実行、
    oryx build の利用などができる
    デプロイ
    

    View Slide

32. Azure/webapps-deploy アクション
    • Azure Web Apps へのデプロイを行う
    • Azure Web Apps
    • Azure Web Apps for Containers
    • スロット指定や、startup-command の実行ができる
    デプロイ
    

    View Slide

33. Azure/static-web-apps-deploy
    • 完璧なインテグレーション！理想形！
    • Azure Static Web Apps へのアプリケーションのビルド、およびデ
    プロイを行う
    • 静的サイトのビルド
    • 内蔵 Functions のビルド
    • pull_request イベントの場合、自動的にプレビュー環境にデプロイし
    てくれる
    • Azure 側の仕組みが完全に連携されている
    ビルド デプロイ ステージング
    

    View Slide

34. Azure/container-apps-deploy-action
    • Azure Container Apps へのイメージビルド、およびデプロイを行う
    • コンテナイメージをビルド
    • Azure Container Registry へ push
    • Azure Container App へデプロイ
    • まだ、v0 だが、ビルド→レジストリへのpush→デプロイまでの一連の
    動作を１つのアクションで扱ってくれるので非常に便利
    ビルド デプロイ
    

    View Slide

35. Azure/aca-review-apps アクション
    • Azure Container apps の複数リビジョンモードを利用して、ステー
    ジング用の環境を構成できる
    • デプロイのみ
    ステージング
    

    View Slide

36. デモ
    

    View Slide

37. デモ①
    Azure Static Web Apps で、プルリクエストごとにプレビュー環境を用意する
    

    View Slide

38. ポイント
    • Azure/static-web-apps-deploy アクションだけで構成されてい
    る
    • 静的アプリケーションのビルド
    • 内蔵 functions のビルド
    • デプロイ
    • pull_request イベントのイベント種別 closed のときは、プレビュー環境のク
    ローズ
    • このワークフローは、Azure ポータルや Azure CLI で自動生成され
    る
    

    View Slide

39. デモ②
    Azure/container-apps-deploy-action ですっきり
    

    View Slide

40. ポイント
    1. Azure Container app の Continuous deployment を設定して自
    動生成されたワークフロー
    • Azureの認証はサービスプリンシパル
    • Azure Container Registry への認証は admin user 有効
    2. Azure/container-apps-deploy-action を利用したワークフロー
    • Azure の認証は、OIDC 接続の例を併せて実装
    • Azure Container Registry の admin user 無効、短期間のアクセストークンを利
    用
    • az acr login --expose-token で短期間のアクセストークンを発行
    • 参考: Azure Container Registry でのリポジトリに対するアクセス許可 - Azure
    Container Registry | Microsoft Learn
    

    View Slide

41. デモ③
    Azure/aca-review-apps でプルリクエストごとにステージング用環境を用意す
    る
    

    View Slide

42. ポイント
    • Azure/aca-review-apps アクションは複数リビジョンモードへのデ
    プロイのみを担う
    • これにより、Azure Container registry 上のリポジトリやイメージな
    どは、用途に応じて運用できる
    • url が出力されるので、GitHub Actions の deployment
    environment の url を利用してプルリクエストに提示することもでき
    る
    

    View Slide

43. よいぞ、
    GitHub Actions
    

    View Slide

44. Thank you so much🍩.
    

    View Slide