タスク 9 - (Option) CI/CD を体験 - UI アプリ

ソースコードを修正した場合、リポジトリにコミットするとワークフローが自動的に起動だれて、速やかに修正内容を Container App にデプロイするように GitHub アクションを設定します。

本タスクは、演習 1 で作成された UI アプリ のみの GitHub リポジトリに対して作業を行いします。

演習作業簡略化のため、ファイルの作成と編集は main ブランチに対して直接行います。

作業

  1. タスク 2 の 1. と同様の手順で、.github/workflows/build-deploy.yml ファイルを編集モードで開きます。
    操作画面イメージ

  2. .github/workflows/build-deploy.yml ファイルの on の末尾に自動実行用トリガーの push を追加します。
     name: Trigger auto deployment
     on:
       # 手動実行用トリガー
       workflow_dispatch:
          
       # Add a trigger
       # 自動実行用トリガー
       push:
         branches: 
           [ main ]
         paths:
         - '**'
    

    注意 各行のインデントを間違いと構文エラーになりますので、ご注意してください。

    操作画面イメージ

確認

  1. 上記 2. の修正が下図赤枠のように .github/workflows/build-deploy.yml ファイルに反映されていることを確認します。
    操作画面イメージ

  2. UI アプリの リポジトリの views/layout.pug のメニュー文言を変更し、main ブランチにコミットします。
    操作画面イメージ

  3. ワークフロー処理が自動的に起動されていることを確認します。
    操作画面イメージ

  4. ワークフロー処理はエラーなく終了し、UI アプリの Container App にリビジョンが更新されていることを確認します。
    操作画面イメージ

  5. UI アプリの URL にアクセスして、変更後のメニュー文言が表示されていることを確認します。
    操作画面イメージ

References