CI CD в GitHub Actions для фронтенда и мобильных приложений

Всем привет! Сегодня я расскажу про то, как можно c помощью CI CD в GitHub Actions упростить себе жизнь и сэкономить много времени, за счет чего повысить качество своего кода и проекта в целом.

Что такое CI CD?

CI/CD — это комбинация непрерывной интеграции (continuous integration) и непрерывного развертывания (continuous delivery или continuous deployment) программного обеспечения в процессе разработки.

Непрерывная интеграция — это практика разработки, предполагающая небольшие изменения кода с частыми коммитами разработчиков. При этом происходит автоматизированная проверка кода на наличие ошибок с помощью выполнения различных тестов и сборок. Основная цель CI — найти баги как можно раньше.

Непрерывная доставка – это практика разработки программного обеспечения, когда при любых изменениях в программном коде выполняется автоматическая сборка, тестирование и подготовка к окончательному выпуску.

Непрерывное развертывание — аналогична с непрерывной доставкой, отличие от непрерывной доставки заключается в том, что при непрерывном развертывании обновлений в рабочей среде не требуется подтверждения вручную.

Что такое Github Actions?

GitHub Actions — это платформа непрерывной интеграции и непрерывной доставки (CI / CD), позволяющая автоматизировать конвейер сборки, тестирования и развертывания.

Как создать первый workflow для Github Action?

Создаем файл. Для этого называем его prod.main.yml по основному необходимому флоу для продакшн стенда.

Все про YAML для тех, кто еще не знаком с этим языком.

Триггеры

Это события, которые вызывают запуск workflow.

Могут быть несколько видов:

События, которые происходят в вашем репозитории
События, которые происходят снаружи GitHub и вызывают repository_dispatch на GitHub
Отложенные
Ручные

Базовые триггеры, использующиеся для запуска workflow:

push — запускает каждый раз на выполнение push в репозиторий
pull_request — каждый раз при создании PR
workflow_dispatch — можно запускать вручную из вкладки Actions в GitHub

Джобы

Джобы — это задания нашего workflow, которые могут выполняться параллельно либо последовательно. Мы пишем ключ jobs, в который будет вложенный мап (за счет отступа пробелами)

jobs: 
	linters:
	prettier:
	types:
	test:

Раннеры для запуска CI CD

В большинстве случаев можно использовать раннер ubuntu-latest, либо использовать специфичный для вашей задачи.

https://docs.github.com/en/actions/using-github-hosted-runners/about-github-hosted-runners

Шаги

Задание содержит последовательность задач, называемых шагами. Шаги могут выполнять команды, задачи настройки или выполнять действие в вашем репозитории, общедоступном репозитории или действие, опубликованное в реестре Docker. Не все шаги запускают действия, но все действия выполняются как шаг. Каждый шаг выполняется в своем собственном процессе в среде runner и имеет доступ к рабочей области и файловой системе. Поскольку шаги выполняются в их собственном процессе, изменения переменных среды не сохраняются между шагами. GitHub предоставляет встроенные инструкции по настройке и завершению задания.

Выстраивание последовательности за счет `needs`

Каждой мапе джоба можно добавить ключ needs, в который мы передадим значением либо название предыдущего джоба

types:
  needs: [linters, prettier]

либо массив из нескольких предыдущих джобов.

types:
  needs: [linters, prettier]

Кеш node modules

- name: Cache Node Modules
  id: node-cache
  uses: actions/cache@v2
  with:
    path: |
      node_modules
      lib/*/node_modules
    key: node-modules-${{ hashFiles('package-lock.json') }}

Частые команды перед коммитами в гит

eslint
prettier
tsc
test

Сборка фронтенда и приложений

Build Web (CRA)

build:
    needs: [linters, prettier, types, test]
    # The type of runner that the job will run on
    runs-on: ubuntu-latest

    steps:
      - uses: actions/checkout@v2
      - uses: actions/setup-node@master

      - name: Cache Node Modules
        id: node-cache
        uses: actions/cache@v2
        with:
          path: |
            node_modules
            lib/*/node_modules
          key: node-modules-${{ hashFiles('package-lock.json') }}

      - name: Install node modules
        run: |
          npm install

      - name: Build project
        id: build_project
        run: |
          npm run build

Build Android

- name: Build Android Application Package
  run: |
    cd android && ./gradlew assembleRelease --no-daemon

Подпись Android приложений

Для использования в workflow чувствительных данных, нам понадобится добавить секретное значение в репозиторий. Заходим в настройки вашего репозитория и находим раздел “Secrets and variables”

Добавляем новое значение и затем используем его в workflow.

- name: Sign App Application Package
  id: sign_app_apk
  uses: r0adkll/sign-android-release@v1
  with:
    releaseDirectory: android/app/build/outputs/apk/release
    signingKeyBase64: ${{ secrets.ANDROID_SIGNING_KEY }}
    alias: ${{ secrets.ANDROID_SIGNING_ALIAS }}
    keyStorePassword: ${{ secrets.ANDROID_SIGNING_STORE_PASSWORD }}
    keyPassword: ${{ secrets.ANDROID_SIGNING_KEY_PASSWORD }}

Build iOS

runs-on: macos-latest
steps:
  - uses: actions/checkout@v2
  - uses: actions/setup-node@master

  - name: Cache Node Modules
    id: node-cache
    uses: actions/cache@v2
    with:
      path: |
        node_modules
        lib/*/node_modules
      key: node-modules-${{ hashFiles('package-lock.json') }}

  - name: Install node modules
    run: |
      npm install
  - run: pod install
    working-directory: ios

  - run: xcodebuild clean archive -workspace testCiCdReactNative.xcworkspace -scheme testCiCdReactNative -archivePath testCiCdReactNative.xcarchive CODE_SIGNING_ALLOWED=NO | xcpretty
    working-directory: ios

Загрузка артефактов CI CD для дальнейшего использования

CRA

- name: Upload Artifact
  uses: actions/upload-artifact@v2
  with:
    name: Build
    path: build

Android

- name: Upload Artifact
  uses: actions/upload-artifact@v2
  with:
    name: Signed Application Package
    path: ${{steps.sign_app_apk.outputs.signedReleaseFile}}

Взаимодействие с firebase test lab

Переиспользование CI CD workflow

Вложенное workflow:

name: Test

on:
  workflow_call:

jobs:
  test:
    name: Run tests
    runs-on: ubuntu-latest

    steps:
      # Checks-out your repository under $GITHUB_WORKSPACE, so your job can access it
      - uses: actions/checkout@v2
      - uses: actions/setup-node@master

      - name: Cache Node Modules
        id: node-cache
        uses: actions/cache@v2
        with:
          path: |
            node_modules
            lib/*/node_modules
          key: node-modules-${{ hashFiles('package-lock.json') }}

      - name: Install node modules
        run: |
          npm install

      - name: Tests
        run: |
          npm run test

Вызов вложенного workflow:

test:
    needs: [linters, prettier, types]
    uses: ./.github/workflows/test.yml
    secrets: inherit

Если у вас есть вопросы по инструментам CI CD GitHub Actions, то пишите в комментариях.