こんにちは開発チームの笠原です！ 今回は DevOps、CI/CD のCI、具体的には GitHub Actions での test / lint を実行してみます。

やること

以下のことを GitHub に Push するだけで行えるようにするのが今回のゴールです。

• eslint / prettier / stylelint でのリント
• jest でのテスト

GitHub Actions の導入

まずはリポジトリルートに以下のファイルを作成してやることを順番に記述します。 .github/workflows/ci.yml

name: CI

on:
  # client 以下に push があれば
  push:
    paths:
      - 'client/**'

jobs:
  build:
    name: build
    runs-on: ubuntu-latest
    # run の作業ディレクトリを一括で './client' に
    defaults:
      run:
        working-directory: ./client
    steps:
      - uses: actions/checkout@v1

      - name: Setup Node.js
        uses: actions/setup-node@v1
        with:
          node-version: '16.14.x'

      - name: yarn install
        run: yarn install
      - name: Run jest test
        run: yarn test
      - name: Run eslint
        run: yarn esilnt
      - name: Run stylelint
        run: yarn stylelint

後は GitHub に push すれば OK！

GitHub Actions の構文についてはこちらを参照 https://docs.github.com/ja/actions/using-workflows/workflow-syntax-for-github-actions

ローカルでのテスト

Github Actions をローカルでテストしたいときには act というツールが使えます。 例えば push をテストするのであれば下記で CI が走ります。

$ act push

まとめ

eslint / prettier / stylelint / jest などを継続して自動で行えば自然とコードの品質が上がります。 今回は Github Actions を使うことでとても簡単に CI を導入できました。 次回は 『Github Actions で Google App Engine (GAE) に自動デプロイする』について書く予定です。

CURUCURU では新しい技術やサービス作りが好きなエンジニアを募集中です！ 「ITで女性のライフスタイルを豊かにする」というミッションの元やりがいのあるサービス作りに携わる事ができます。

CURUCURU でエンジニアとして働くことに興味がある方はよければオンラインでカジュアルにお話しましょう！ https://www.wantedly.com/companies/curucuru/projects