【CI/CD】GitHub Actionsの使い方!プッシュなどで処理を自動化

【CI/CD】GitHub Actionsの使い方!プッシュなどで処理を自動化

この記事からわかること

  • GitHub Actionsとは?
  • ソースコード管理する方法

index

[open]

\ アプリをリリースしました /

みんなの誕生日

友達や家族の誕生日をメモ!通知も届く-みんなの誕生日-

posted withアプリーチ

GitHub Actionsとは?

公式リファレンス:GitHub Actions

GitHub Actions」はGitHubが提供するCI/CD(継続的インテグレーション/継続的デリバリー)サービスです。一部制限はかかってしまいますが基本的には無料で利用することができるようになっています。

GitHub Actionsがどのようなものかをざっくり説明すると「特定の条件を満たした場合に任意の処理を行うことができる」サービスになります。またこの条件分岐から処理実行までの一連の流れを「ワークフロー」と呼びます。

特定の条件というのはプッシュやPRの作成、などGitHub上で発生する特定のイベントを指定することができます。任意の処理にはデプロイやテストの実行、ドキュメントの作成など多岐にわたり、独自のカスタムアクションを作成することが可能になっています。

CI/CDとは?

CI/CD」とは「Continuous Integration(継続的インテグレーション)」と「Continuous Deployment/Delivery(継続的デリバリー/デプロイメント)」の略称でソフトウェア開発のプロセスにおける自動化の手法のことです。

開発者がコードを変更してからそれをテスト、本番環境へのデプロイまでを自動化することで開発効率の向上が行えるようになります。GitHub ActionsだけでなくCircleCIなども有名です。

公式リファレンス:CircleCI

GitHub Actionsの使い方

流れ

  1. GitHubにリポジトリを作成
  2. .github/workflowsディレクトリを用意
  3. YAMLファイルの中身を記述

1.GitHubにリポジトリを作成

まずはGitHubにリモートリポジトリを作成します。任意の公開範囲と名称で作成しておいてくだし。

GitHubからリモートリポジトリを作成する手順

2..github/workflowsディレクトリを用意

GitHub Actionsをリポジトリで使用するためにはリポジトリ内に.github/workflowsというディレクトリを作成し、そのディレクトリ内に「main.yml」というYAML形式のファイルを作成する必要があります。(名前は任意のもので構いません)

作成は「リポジトリ」>「Actions」>「set up a workflow yourself」をクリックします。

【CI/CD】GitHub Actionsの使い方!プッシュなどで処理を自動化

すると以下の画面になりGUI操作でYAMLのファイル名と中身を記述してコミットできるようになります。これで.github/workflows/main.yml時は簡単に作成できます。(もちろんローカルで作成してもOK)

【CI/CD】GitHub Actionsの使い方!プッシュなどで処理を自動化

3.YAMLファイルの中身を記述

YAMLファイルの中には特定の処理を実行する条件と実際に実行したい処理をYAML形式で記述します。中身に記述する要素は以下のとおりです。

要素 説明
name ワークフローの名前を指定 name: My CI Workflow
on ワークフローをトリガーするイベントを指定 on:
push:
branches:
- main
jobs ワークフロー内のジョブを定義 jobs:
build:
runs-on: ubuntu-latest
runs-on ジョブを実行する環境を指定 runs-on: ubuntu-latest
steps ジョブ内の各ステップを定義 steps:
- name: Checkout code
uses: actions/checkout@v2
uses 外部アクションやGitHubが提供するアクションを指定 uses: actions/setup-node@v2
with アクションに対してパラメータを渡す with:
node-version: '14'
env 環境変数を指定 env:
NODE_ENV: production
if 条件付きでステップやジョブを実行するために使用 if: github.event_name == 'push'
timeout-minutes ジョブの実行がタイムアウトするまでの時間を指定 timeout-minutes: 10

プッシュログを記録するアクションを実装してみる

テストとして「プッシュした時間やユーザーをログとして記録してコミットしていく処理を実装」してみたいと思います。ymlファイルに記述する内容はざっくり以下の通りになります。

  1. プッシュされたことを検知する条件を追加
  2. リポジトリのコードをチェックアウト(取得)
  3. ログファイルに記録を追記するアクションを実装
  4. ログファイルの変更をコミットしてプッシュするアクションを実装

最初にリポジトリがGitHub Actionsから書き込みができるように設定を変更する必要があります。「リポジトリ」>「Settings」>「Actions」>「General」>「Workflow permissions」の設定を「Read and write permissions」に変更しておいてください。

1.プッシュされたことを検知する条件を追加

まずはワークフローの名前をname:の後に記述します。続いて今回はプッシュされたことをトリガーにしたいのでon: → push:を指定しさらに特定のブランチのみに制限したいのでbranches:mainを指定します。


# このワークフローの名前を指定
name: Record Push Info

# 1.プッシュされたことを検知する条件
on:
  push:
    branches:
      # mainブランチへのプッシュ時のみに発火
      - main 

2.リポジトリのコードをチェックアウト(取得)

続いてジョブを定義していきます。ジョブ名と実行環境を指定しsteps:の中に今回行いたい処理の流れを定義していきます。今回は対象のリポジトリ内に変更を加えるので参照できるようにまずはリポジトリのコードをチェックアウト(取得)します。


# ジョブを定義
jobs:
  # ジョブ名を指定
  log_push_info:
    # 実行環境を指定
    runs-on: ubuntu-latest

    # ジョブ内の各ステップを定義
    steps:
      # 2.リポジトリのコードをチェックアウト(取得)
      - name: Checkout code
        uses: actions/checkout@v2

コードを取得するアクションはGitHubが提供するアクションに用意されているのでuses: actions/checkout@v2を指定するだけです。

3.ログファイルに記録を追記するアクションを実装

今回は「push_log.md」というファイルを用意してここに追記していくようにします。run:を使用して実行したい処理をシェルスクリプトで記述していきます。(>>は追記)


      # 3.ログファイルに記録を追記するアクション
      - name: Record push information
        run: |
          echo "### Push Record" >> push_log.md
          # $(date) dateコマンドを実行して現在時刻を取得
          echo "- Date: $(date)" >> push_log.md
          # githubコンテキストからブランチを取得
          echo "- Branch: ${{ github.ref }}" >> push_log.md
          # githubコンテキストからアカウント名を取得
          echo "- Committer: ${{ github.actor }}" >> push_log.md
          echo "" >> push_log.md

ワークフロー内ではgithubのような特定の値を参照できるコンテキストが用意されています。例えばgithubならアカウント名や対象ブランチなどを取得できます。

公式リファレンス:github-context

4.ログファイルの変更をコミットしてプッシュするアクションを実装

最後にログファイルの変更をワークフローの中からコミットしてプッシュする処理を実装します。ここでは自身のアカウント情報をgit configでセットする必要があります。


      # 4.ログファイルの変更をコミットしてプッシュするアクションを実装
      - name: Commit and push changes
        run: |
          git config --global user.name "自身のユーザー名"
          git config --global user.email "自身のメールアドレス"
          git add push_log.md
          git commit -m "Update push log"
          git push
        env:
          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

アクション内からリポジトリに対して安全に操作を行えるようにセキュリティ対策が施されています。そのためGITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}を指定します。secretsコンテキストから取得できるGITHUB_TOKENワークフローの実行ごとに自動的に作成されるトークンになります。

公式リファレンス:secrets-context

5.完成

これでymlファイルが完成です。今回はプッシュとともに発火するので何かしらの変更をリポジトリに加えてプッシュしてみます。


# このワークフローの名前を指定
name: Record Push Info

# 1.プッシュされたことを検知する条件
on:
  push:
    branches:
      # mainブランチへのプッシュ時のみに発火
      - main 

# ジョブを定義
jobs:
  # ジョブ名を指定
  log_push_info:
    # 実行環境を指定
    runs-on: ubuntu-latest

    # ジョブ内の各ステップを定義
    steps:
      # 2.リポジトリのコードをチェックアウト(取得)
      - name: Checkout code
        uses: actions/checkout@v2

      # 3.ログファイルに記録を追記するアクション
      - name: Record push information
        run: |
          echo "### Push Record" >> push_log.md
          # $(date) dateコマンドを実行して現在時刻を取得
          echo "- Date: $(date)" >> push_log.md
          # githubコンテキストからブランチを取得
          echo "- Branch: ${{ github.ref }}" >> push_log.md
          # githubコンテキストからアカウント名を取得
          echo "- Committer: ${{ github.actor }}" >> push_log.md
          echo "" >> push_log.md

      # 4.ログファイルの変更をコミットしてプッシュするアクションを実装
      - name: Commit and push changes
        run: |
          git config --global user.name "自身のユーザー名"
          git config --global user.email "自身のメールアドレス"
          git add push_log.md
          git commit -m "Update push log"
          git push
        env:
          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

6.動作確認

GitHub Actionsの実行状況や実行結果、ログなどは「リポジトリ」>「Actions」から確認することができます。コミットメッセージとともにアクションのステータスなどが表示され、黄色が処理中、緑が成功、赤色は失敗をあらわしています。

【CI/CD】GitHub Actionsの使い方!プッシュなどで処理を自動化

失敗していた場合はログを確認して原因を突き止めます。ymlファイル自体に構文エラーがあった場合やアクションが正常に動作しなかった場合などはエラーを吐いて教えてくれるので確認してみてください。確認方法は失敗したアクションをタップしてエラーの発生しているジョブ名をクリックすれば以下のようにログが確認できます。

【CI/CD】GitHub Actionsの使い方!プッシュなどで処理を自動化

まだまだ勉強中ですので間違っている点や至らぬ点がありましたら教えていただけると助かります。

ご覧いただきありがとうございました。

searchbox

スポンサー

ProFile

ame

趣味:読書,プログラミング学習,サイト制作,ブログ

IT嫌いを克服するためにITパスを取得しようと勉強してからサイト制作が趣味に変わりました笑
今はCMSを使わずこのサイトを完全自作でサイト運営中〜

New Article

index