← JavaScript/CI/CD: непрерывная интеграция#364 из 430← Предыдущий Следующий →+20 XP

Полезно по теме:Гайд: как учить JavaScript Практика: JS база Практика: async и сеть Термин: Closure

CI/CD: непрерывная интеграция

Что такое CI/CD

CI/CD — это набор практик, которые автоматизируют процесс доставки кода от разработчика до пользователя.

CI (Continuous Integration) — непрерывная интеграция. Каждый push автоматически запускает сборку и тесты. Цель — ловить баги как можно раньше.

CD (Continuous Delivery) — непрерывная доставка. Код всегда готов к деплою, но выкатка происходит вручную по нажатию кнопки.

CD (Continuous Deployment) — непрерывное развёртывание. Код автоматически попадает в production после прохождения всех проверок. Никакого ручного вмешательства.

CI                    CD (Delivery)         CD (Deployment)
Push → Build → Test → Ready to deploy →     Auto deploy
                      ↑ ручная кнопка       ↑ автоматически

Зачем это нужно

Без CI/CD:

Разработчик забыл запустить тесты — баг в production

«У меня локально работает» — классическая проблема

Деплой вручную по SSH — долго, рискованно, непредсказуемо

Конфликты копятся неделями и разрешаются больно

С CI/CD:

Каждый коммит проверен — тесты, линтер, сборка автоматически

Быстрая обратная связь — узнал о баге через 2 минуты, а не через 2 недели

Предсказуемый деплой — один и тот же процесс каждый раз

Уверенность в коде — зелёный CI = можно мержить

GitHub Actions — основы

GitHub Actions — встроенная CI/CD платформа GitHub. Бесплатна для открытых репозиториев и имеет щедрый лимит для приватных.

Где живут workflows

my-project/
├── .github/
│   └── workflows/
│       ├── ci.yml          # основной CI pipeline
│       ├── deploy.yml      # деплой
│       └── lint.yml        # линтер
├── src/
└── package.json

Файлы workflow — это YAML-файлы в папке .github/workflows/.

YAML — основы синтаксиса

YAML — язык разметки для конфигураций. Используется в GitHub Actions, Docker Compose, Kubernetes.

# Строки
name: My Workflow
message: "Hello, World!"

# Списки
steps:
  - first
  - second
  - third

# Объекты (вложенность через отступы — 2 пробела!)
job:
  name: Build
  runs-on: ubuntu-latest

# Многострочные строки
description: |
  Это многострочный текст.
  Каждая строка сохраняется.

Важно: YAML чувствителен к отступам. Всегда используйте пробелы, не табы!

Структура GitHub Actions workflow

# Название workflow (видно во вкладке Actions)
name: CI

# Триггеры — когда запускать
on:
  push:
    branches: [main]
  pull_request:
    branches: [main]

# Задачи
jobs:
  build:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - name: Install dependencies
        run: npm install
      - name: Run tests
        run: npm test

Ключевые элементы

Элемент	Описание
`name`	Название workflow
`on`	Когда запускать (триггеры)
`jobs`	Набор задач для выполнения
`runs-on`	На какой ОС запускать
`steps`	Последовательность шагов в задаче
`uses`	Подключить готовое action
`run`	Выполнить shell-команду

Триггеры (on)

Push — при каждом push

on:
  push:
    branches: [main, develop]
    paths:
      - 'src/**'
      - 'package.json'

Pull Request — при создании/обновлении PR

on:
  pull_request:
    branches: [main]
    types: [opened, synchronize, reopened]

По расписанию (cron)

on:
  schedule:
    - cron: '0 9 * * 1'  # Каждый понедельник в 9:00 UTC

Ручной запуск

on:
  workflow_dispatch:
    inputs:
      environment:
        description: 'Deploy environment'
        required: true
        default: 'staging'

Комбинация триггеров

on:
  push:
    branches: [main]
  pull_request:
    branches: [main]
  workflow_dispatch:

Jobs и Steps

Jobs — параллельные задачи

По умолчанию jobs выполняются параллельно:

jobs:
  lint:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - run: npm ci
      - run: npm run lint

  test:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - run: npm ci
      - run: npm test

  build:
    runs-on: ubuntu-latest
    needs: [lint, test]  # ждёт завершения lint и test
    steps:
      - uses: actions/checkout@v4
      - run: npm ci
      - run: npm run build

Ключевое слово needs задаёт зависимости между jobs. В примере выше build запустится только после успешного завершения lint и test.

Steps — последовательные шаги

steps:
  # Шаг 1: клонировать репозиторий
  - uses: actions/checkout@v4

  # Шаг 2: установить Node.js
  - uses: actions/setup-node@v4
    with:
      node-version: '20'
      cache: 'npm'

  # Шаг 3: установить зависимости
  - name: Install dependencies
    run: npm ci

  # Шаг 4: запустить тесты
  - name: Run tests
    run: npm test

Практика: CI для React проекта

Запуск тестов на каждый push

name: CI

on:
  push:
    branches: [main, develop]
  pull_request:
    branches: [main]

jobs:
  test:
    runs-on: ubuntu-latest
    strategy:
      matrix:
        node-version: [18, 20]

    steps:
      - uses: actions/checkout@v4

      - name: Use Node.js ${{ matrix.node-version }}
        uses: actions/setup-node@v4
        with:
          node-version: ${{ matrix.node-version }}
          cache: 'npm'

      - name: Install dependencies
        run: npm ci

      - name: Run tests
        run: npm test -- --coverage

      - name: Upload coverage
        if: matrix.node-version == 20
        uses: actions/upload-artifact@v4
        with:
          name: coverage-report
          path: coverage/

strategy.matrix позволяет запускать одну и ту же задачу с разными параметрами — например, на разных версиях Node.js.

Линтинг в CI

name: Lint

on:
  pull_request:
    branches: [main]

jobs:
  lint:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4

      - uses: actions/setup-node@v4
        with:
          node-version: '20'
          cache: 'npm'

      - run: npm ci

      - name: ESLint
        run: npm run lint

      - name: TypeScript check
        run: npx tsc --noEmit

      - name: Prettier check
        run: npx prettier --check "src/**/*.{ts,tsx}"

Типичные workflows

Полный CI pipeline

name: Full CI

on:
  pull_request:
    branches: [main]

jobs:
  quality:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - uses: actions/setup-node@v4
        with:
          node-version: '20'
          cache: 'npm'
      - run: npm ci
      - run: npm run lint
      - run: npx tsc --noEmit
      - run: npm test -- --coverage
      - run: npm run build

Автоматическое обновление зависимостей (Dependabot)

# .github/dependabot.yml
version: 2
updates:
  - package-ecosystem: npm
    directory: /
    schedule:
      interval: weekly
    open-pull-requests-limit: 10

Полезные actions

Action	Описание
`actions/checkout@v4`	Клонировать репозиторий
`actions/setup-node@v4`	Установить Node.js
`actions/cache@v4`	Кэширование зависимостей
`actions/upload-artifact@v4`	Сохранить артефакты сборки
`github/codeql-action`	Анализ безопасности кода

Статусные проверки (Status Checks)

GitHub позволяет сделать CI обязательным для мержа PR:

1.Settings → Branches → Branch protection rules

2.Require status checks to pass before merging

3.Выбрать нужные workflow (например, "test", "lint")

Теперь никто не сможет замержить PR, если CI красный. Это главная защита от багов в production.

Примеры

Минимальный CI workflow для Node.js проекта

name: CI

on:
  push:
    branches: [main, develop]
  pull_request:
    branches: [main]

jobs:
  ci:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - uses: actions/setup-node@v4
        with:
          node-version: '20'
          cache: 'npm'
      - run: npm ci
      - run: npm run lint
      - run: npm test
      - run: npm run build

Матрица версий Node.js в CI

jobs:
  test:
    runs-on: ubuntu-latest
    strategy:
      matrix:
        node-version: [18, 20]
    steps:
      - uses: actions/checkout@v4
      - uses: actions/setup-node@v4
        with:
          node-version: ${{ matrix.node-version }}
      - run: npm ci
      - run: npm test

CI/CD: непрерывная интеграция

Что такое CI/CD

CI/CD — это набор практик, которые автоматизируют процесс доставки кода от разработчика до пользователя.

CI                    CD (Delivery)         CD (Deployment)
Push → Build → Test → Ready to deploy →     Auto deploy
                      ↑ ручная кнопка       ↑ автоматически

Зачем это нужно

Без CI/CD:

Разработчик забыл запустить тесты — баг в production

«У меня локально работает» — классическая проблема

Деплой вручную по SSH — долго, рискованно, непредсказуемо

Конфликты копятся неделями и разрешаются больно

С CI/CD:

Каждый коммит проверен — тесты, линтер, сборка автоматически

Быстрая обратная связь — узнал о баге через 2 минуты, а не через 2 недели

Предсказуемый деплой — один и тот же процесс каждый раз

Уверенность в коде — зелёный CI = можно мержить

GitHub Actions — основы

Где живут workflows

my-project/
├── .github/
│   └── workflows/
│       ├── ci.yml          # основной CI pipeline
│       ├── deploy.yml      # деплой
│       └── lint.yml        # линтер
├── src/
└── package.json

Файлы workflow — это YAML-файлы в папке .github/workflows/.

YAML — основы синтаксиса

YAML — язык разметки для конфигураций. Используется в GitHub Actions, Docker Compose, Kubernetes.

# Строки
name: My Workflow
message: "Hello, World!"

# Списки
steps:
  - first
  - second
  - third

# Объекты (вложенность через отступы — 2 пробела!)
job:
  name: Build
  runs-on: ubuntu-latest

# Многострочные строки
description: |
  Это многострочный текст.
  Каждая строка сохраняется.

Важно: YAML чувствителен к отступам. Всегда используйте пробелы, не табы!

Структура GitHub Actions workflow

# Название workflow (видно во вкладке Actions)
name: CI

# Триггеры — когда запускать
on:
  push:
    branches: [main]
  pull_request:
    branches: [main]

# Задачи
jobs:
  build:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - name: Install dependencies
        run: npm install
      - name: Run tests
        run: npm test

Ключевые элементы

Элемент	Описание
`name`	Название workflow
`on`	Когда запускать (триггеры)
`jobs`	Набор задач для выполнения
`runs-on`	На какой ОС запускать
`steps`	Последовательность шагов в задаче
`uses`	Подключить готовое action
`run`	Выполнить shell-команду

Триггеры (on)

Push — при каждом push

on:
  push:
    branches: [main, develop]
    paths:
      - 'src/**'
      - 'package.json'

Pull Request — при создании/обновлении PR

on:
  pull_request:
    branches: [main]
    types: [opened, synchronize, reopened]

По расписанию (cron)

on:
  schedule:
    - cron: '0 9 * * 1'  # Каждый понедельник в 9:00 UTC

Ручной запуск

on:
  workflow_dispatch:
    inputs:
      environment:
        description: 'Deploy environment'
        required: true
        default: 'staging'

Комбинация триггеров

on:
  push:
    branches: [main]
  pull_request:
    branches: [main]
  workflow_dispatch:

Jobs и Steps

Jobs — параллельные задачи

По умолчанию jobs выполняются параллельно:

jobs:
  lint:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - run: npm ci
      - run: npm run lint

  test:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - run: npm ci
      - run: npm test

  build:
    runs-on: ubuntu-latest
    needs: [lint, test]  # ждёт завершения lint и test
    steps:
      - uses: actions/checkout@v4
      - run: npm ci
      - run: npm run build

Steps — последовательные шаги

steps:
  # Шаг 1: клонировать репозиторий
  - uses: actions/checkout@v4

  # Шаг 2: установить Node.js
  - uses: actions/setup-node@v4
    with:
      node-version: '20'
      cache: 'npm'

  # Шаг 3: установить зависимости
  - name: Install dependencies
    run: npm ci

  # Шаг 4: запустить тесты
  - name: Run tests
    run: npm test

Практика: CI для React проекта

Запуск тестов на каждый push

name: CI

on:
  push:
    branches: [main, develop]
  pull_request:
    branches: [main]

jobs:
  test:
    runs-on: ubuntu-latest
    strategy:
      matrix:
        node-version: [18, 20]

    steps:
      - uses: actions/checkout@v4

      - name: Use Node.js ${{ matrix.node-version }}
        uses: actions/setup-node@v4
        with:
          node-version: ${{ matrix.node-version }}
          cache: 'npm'

      - name: Install dependencies
        run: npm ci

      - name: Run tests
        run: npm test -- --coverage

      - name: Upload coverage
        if: matrix.node-version == 20
        uses: actions/upload-artifact@v4
        with:
          name: coverage-report
          path: coverage/

strategy.matrix позволяет запускать одну и ту же задачу с разными параметрами — например, на разных версиях Node.js.

Линтинг в CI

name: Lint

on:
  pull_request:
    branches: [main]

jobs:
  lint:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4

      - uses: actions/setup-node@v4
        with:
          node-version: '20'
          cache: 'npm'

      - run: npm ci

      - name: ESLint
        run: npm run lint

      - name: TypeScript check
        run: npx tsc --noEmit

      - name: Prettier check
        run: npx prettier --check "src/**/*.{ts,tsx}"

Типичные workflows

Полный CI pipeline

name: Full CI

on:
  pull_request:
    branches: [main]

jobs:
  quality:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - uses: actions/setup-node@v4
        with:
          node-version: '20'
          cache: 'npm'
      - run: npm ci
      - run: npm run lint
      - run: npx tsc --noEmit
      - run: npm test -- --coverage
      - run: npm run build

Автоматическое обновление зависимостей (Dependabot)

# .github/dependabot.yml
version: 2
updates:
  - package-ecosystem: npm
    directory: /
    schedule:
      interval: weekly
    open-pull-requests-limit: 10

Полезные actions

Action	Описание
`actions/checkout@v4`	Клонировать репозиторий
`actions/setup-node@v4`	Установить Node.js
`actions/cache@v4`	Кэширование зависимостей
`actions/upload-artifact@v4`	Сохранить артефакты сборки
`github/codeql-action`	Анализ безопасности кода

Статусные проверки (Status Checks)

GitHub позволяет сделать CI обязательным для мержа PR:

1.Settings → Branches → Branch protection rules

2.Require status checks to pass before merging

3.Выбрать нужные workflow (например, "test", "lint")

Теперь никто не сможет замержить PR, если CI красный. Это главная защита от багов в production.

Примеры

Минимальный CI workflow для Node.js проекта

name: CI

on:
  push:
    branches: [main, develop]
  pull_request:
    branches: [main]

jobs:
  ci:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - uses: actions/setup-node@v4
        with:
          node-version: '20'
          cache: 'npm'
      - run: npm ci
      - run: npm run lint
      - run: npm test
      - run: npm run build

Матрица версий Node.js в CI

jobs:
  test:
    runs-on: ubuntu-latest
    strategy:
      matrix:
        node-version: [18, 20]
    steps:
      - uses: actions/checkout@v4
      - uses: actions/setup-node@v4
        with:
          node-version: ${{ matrix.node-version }}
      - run: npm ci
      - run: npm test

📖

Теоретический урок

Изучи материал выше и задай вопросы AI если что-то непонятно

Этот урок содержит теоретическую информацию. Изучи материал, затем отметь урок как пройденный.

Загружаем AI-помощника...

← JavaScript/CI/CD: непрерывная интеграция#364 из 430← Предыдущий Следующий →+20 XP

Полезно по теме:Гайд: как учить JavaScript Практика: JS база Практика: async и сеть Термин: Closure

← Назад Далее →

CI/CD: непрерывная интеграция

Что такое CI/CD

CI/CD — это набор практик, которые автоматизируют процесс доставки кода от разработчика до пользователя.

CI                    CD (Delivery)         CD (Deployment)
Push → Build → Test → Ready to deploy →     Auto deploy
                      ↑ ручная кнопка       ↑ автоматически

Зачем это нужно

Без CI/CD:

Разработчик забыл запустить тесты — баг в production

«У меня локально работает» — классическая проблема

Деплой вручную по SSH — долго, рискованно, непредсказуемо

Конфликты копятся неделями и разрешаются больно

С CI/CD:

Каждый коммит проверен — тесты, линтер, сборка автоматически

Быстрая обратная связь — узнал о баге через 2 минуты, а не через 2 недели

Предсказуемый деплой — один и тот же процесс каждый раз

Уверенность в коде — зелёный CI = можно мержить

GitHub Actions — основы

Где живут workflows

my-project/
├── .github/
│   └── workflows/
│       ├── ci.yml          # основной CI pipeline
│       ├── deploy.yml      # деплой
│       └── lint.yml        # линтер
├── src/
└── package.json

Файлы workflow — это YAML-файлы в папке .github/workflows/.

YAML — основы синтаксиса

YAML — язык разметки для конфигураций. Используется в GitHub Actions, Docker Compose, Kubernetes.

# Строки
name: My Workflow
message: "Hello, World!"

# Списки
steps:
  - first
  - second
  - third

# Объекты (вложенность через отступы — 2 пробела!)
job:
  name: Build
  runs-on: ubuntu-latest

# Многострочные строки
description: |
  Это многострочный текст.
  Каждая строка сохраняется.

Важно: YAML чувствителен к отступам. Всегда используйте пробелы, не табы!

Структура GitHub Actions workflow

# Название workflow (видно во вкладке Actions)
name: CI

# Триггеры — когда запускать
on:
  push:
    branches: [main]
  pull_request:
    branches: [main]

# Задачи
jobs:
  build:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - name: Install dependencies
        run: npm install
      - name: Run tests
        run: npm test

Ключевые элементы

Элемент	Описание
`name`	Название workflow
`on`	Когда запускать (триггеры)
`jobs`	Набор задач для выполнения
`runs-on`	На какой ОС запускать
`steps`	Последовательность шагов в задаче
`uses`	Подключить готовое action
`run`	Выполнить shell-команду

Триггеры (on)

Push — при каждом push

on:
  push:
    branches: [main, develop]
    paths:
      - 'src/**'
      - 'package.json'

Pull Request — при создании/обновлении PR

on:
  pull_request:
    branches: [main]
    types: [opened, synchronize, reopened]

По расписанию (cron)

on:
  schedule:
    - cron: '0 9 * * 1'  # Каждый понедельник в 9:00 UTC

Ручной запуск

on:
  workflow_dispatch:
    inputs:
      environment:
        description: 'Deploy environment'
        required: true
        default: 'staging'

Комбинация триггеров

on:
  push:
    branches: [main]
  pull_request:
    branches: [main]
  workflow_dispatch:

Jobs и Steps

Jobs — параллельные задачи

По умолчанию jobs выполняются параллельно:

jobs:
  lint:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - run: npm ci
      - run: npm run lint

  test:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - run: npm ci
      - run: npm test

  build:
    runs-on: ubuntu-latest
    needs: [lint, test]  # ждёт завершения lint и test
    steps:
      - uses: actions/checkout@v4
      - run: npm ci
      - run: npm run build

Steps — последовательные шаги

steps:
  # Шаг 1: клонировать репозиторий
  - uses: actions/checkout@v4

  # Шаг 2: установить Node.js
  - uses: actions/setup-node@v4
    with:
      node-version: '20'
      cache: 'npm'

  # Шаг 3: установить зависимости
  - name: Install dependencies
    run: npm ci

  # Шаг 4: запустить тесты
  - name: Run tests
    run: npm test

Практика: CI для React проекта

Запуск тестов на каждый push

name: CI

on:
  push:
    branches: [main, develop]
  pull_request:
    branches: [main]

jobs:
  test:
    runs-on: ubuntu-latest
    strategy:
      matrix:
        node-version: [18, 20]

    steps:
      - uses: actions/checkout@v4

      - name: Use Node.js ${{ matrix.node-version }}
        uses: actions/setup-node@v4
        with:
          node-version: ${{ matrix.node-version }}
          cache: 'npm'

      - name: Install dependencies
        run: npm ci

      - name: Run tests
        run: npm test -- --coverage

      - name: Upload coverage
        if: matrix.node-version == 20
        uses: actions/upload-artifact@v4
        with:
          name: coverage-report
          path: coverage/

strategy.matrix позволяет запускать одну и ту же задачу с разными параметрами — например, на разных версиях Node.js.

Линтинг в CI

name: Lint

on:
  pull_request:
    branches: [main]

jobs:
  lint:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4

      - uses: actions/setup-node@v4
        with:
          node-version: '20'
          cache: 'npm'

      - run: npm ci

      - name: ESLint
        run: npm run lint

      - name: TypeScript check
        run: npx tsc --noEmit

      - name: Prettier check
        run: npx prettier --check "src/**/*.{ts,tsx}"

Типичные workflows

Полный CI pipeline

name: Full CI

on:
  pull_request:
    branches: [main]

jobs:
  quality:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - uses: actions/setup-node@v4
        with:
          node-version: '20'
          cache: 'npm'
      - run: npm ci
      - run: npm run lint
      - run: npx tsc --noEmit
      - run: npm test -- --coverage
      - run: npm run build

Автоматическое обновление зависимостей (Dependabot)

# .github/dependabot.yml
version: 2
updates:
  - package-ecosystem: npm
    directory: /
    schedule:
      interval: weekly
    open-pull-requests-limit: 10

Полезные actions

Action	Описание
`actions/checkout@v4`	Клонировать репозиторий
`actions/setup-node@v4`	Установить Node.js
`actions/cache@v4`	Кэширование зависимостей
`actions/upload-artifact@v4`	Сохранить артефакты сборки
`github/codeql-action`	Анализ безопасности кода

Статусные проверки (Status Checks)

GitHub позволяет сделать CI обязательным для мержа PR:

1.Settings → Branches → Branch protection rules

2.Require status checks to pass before merging

3.Выбрать нужные workflow (например, "test", "lint")

Теперь никто не сможет замержить PR, если CI красный. Это главная защита от багов в production.

Примеры

Минимальный CI workflow для Node.js проекта

name: CI

on:
  push:
    branches: [main, develop]
  pull_request:
    branches: [main]

jobs:
  ci:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - uses: actions/setup-node@v4
        with:
          node-version: '20'
          cache: 'npm'
      - run: npm ci
      - run: npm run lint
      - run: npm test
      - run: npm run build

Матрица версий Node.js в CI

jobs:
  test:
    runs-on: ubuntu-latest
    strategy:
      matrix:
        node-version: [18, 20]
    steps:
      - uses: actions/checkout@v4
      - uses: actions/setup-node@v4
        with:
          node-version: ${{ matrix.node-version }}
      - run: npm ci
      - run: npm test

CI/CD: непрерывная интеграция

Что такое CI/CD

CI/CD — это набор практик, которые автоматизируют процесс доставки кода от разработчика до пользователя.

CI                    CD (Delivery)         CD (Deployment)
Push → Build → Test → Ready to deploy →     Auto deploy
                      ↑ ручная кнопка       ↑ автоматически

Зачем это нужно

Без CI/CD:

Разработчик забыл запустить тесты — баг в production

«У меня локально работает» — классическая проблема

Деплой вручную по SSH — долго, рискованно, непредсказуемо

Конфликты копятся неделями и разрешаются больно

С CI/CD:

Каждый коммит проверен — тесты, линтер, сборка автоматически

Быстрая обратная связь — узнал о баге через 2 минуты, а не через 2 недели

Предсказуемый деплой — один и тот же процесс каждый раз

Уверенность в коде — зелёный CI = можно мержить

GitHub Actions — основы

Где живут workflows

my-project/
├── .github/
│   └── workflows/
│       ├── ci.yml          # основной CI pipeline
│       ├── deploy.yml      # деплой
│       └── lint.yml        # линтер
├── src/
└── package.json

Файлы workflow — это YAML-файлы в папке .github/workflows/.

YAML — основы синтаксиса

YAML — язык разметки для конфигураций. Используется в GitHub Actions, Docker Compose, Kubernetes.

# Строки
name: My Workflow
message: "Hello, World!"

# Списки
steps:
  - first
  - second
  - third

# Объекты (вложенность через отступы — 2 пробела!)
job:
  name: Build
  runs-on: ubuntu-latest

# Многострочные строки
description: |
  Это многострочный текст.
  Каждая строка сохраняется.

Важно: YAML чувствителен к отступам. Всегда используйте пробелы, не табы!

Структура GitHub Actions workflow

# Название workflow (видно во вкладке Actions)
name: CI

# Триггеры — когда запускать
on:
  push:
    branches: [main]
  pull_request:
    branches: [main]

# Задачи
jobs:
  build:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - name: Install dependencies
        run: npm install
      - name: Run tests
        run: npm test

Ключевые элементы

Элемент	Описание
`name`	Название workflow
`on`	Когда запускать (триггеры)
`jobs`	Набор задач для выполнения
`runs-on`	На какой ОС запускать
`steps`	Последовательность шагов в задаче
`uses`	Подключить готовое action
`run`	Выполнить shell-команду

Триггеры (on)

Push — при каждом push

on:
  push:
    branches: [main, develop]
    paths:
      - 'src/**'
      - 'package.json'

Pull Request — при создании/обновлении PR

on:
  pull_request:
    branches: [main]
    types: [opened, synchronize, reopened]

По расписанию (cron)

on:
  schedule:
    - cron: '0 9 * * 1'  # Каждый понедельник в 9:00 UTC

Ручной запуск

on:
  workflow_dispatch:
    inputs:
      environment:
        description: 'Deploy environment'
        required: true
        default: 'staging'

Комбинация триггеров

on:
  push:
    branches: [main]
  pull_request:
    branches: [main]
  workflow_dispatch:

Jobs и Steps

Jobs — параллельные задачи

По умолчанию jobs выполняются параллельно:

jobs:
  lint:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - run: npm ci
      - run: npm run lint

  test:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - run: npm ci
      - run: npm test

  build:
    runs-on: ubuntu-latest
    needs: [lint, test]  # ждёт завершения lint и test
    steps:
      - uses: actions/checkout@v4
      - run: npm ci
      - run: npm run build

Steps — последовательные шаги

steps:
  # Шаг 1: клонировать репозиторий
  - uses: actions/checkout@v4

  # Шаг 2: установить Node.js
  - uses: actions/setup-node@v4
    with:
      node-version: '20'
      cache: 'npm'

  # Шаг 3: установить зависимости
  - name: Install dependencies
    run: npm ci

  # Шаг 4: запустить тесты
  - name: Run tests
    run: npm test

Практика: CI для React проекта

Запуск тестов на каждый push

name: CI

on:
  push:
    branches: [main, develop]
  pull_request:
    branches: [main]

jobs:
  test:
    runs-on: ubuntu-latest
    strategy:
      matrix:
        node-version: [18, 20]

    steps:
      - uses: actions/checkout@v4

      - name: Use Node.js ${{ matrix.node-version }}
        uses: actions/setup-node@v4
        with:
          node-version: ${{ matrix.node-version }}
          cache: 'npm'

      - name: Install dependencies
        run: npm ci

      - name: Run tests
        run: npm test -- --coverage

      - name: Upload coverage
        if: matrix.node-version == 20
        uses: actions/upload-artifact@v4
        with:
          name: coverage-report
          path: coverage/

strategy.matrix позволяет запускать одну и ту же задачу с разными параметрами — например, на разных версиях Node.js.

Линтинг в CI

name: Lint

on:
  pull_request:
    branches: [main]

jobs:
  lint:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4

      - uses: actions/setup-node@v4
        with:
          node-version: '20'
          cache: 'npm'

      - run: npm ci

      - name: ESLint
        run: npm run lint

      - name: TypeScript check
        run: npx tsc --noEmit

      - name: Prettier check
        run: npx prettier --check "src/**/*.{ts,tsx}"

Типичные workflows

Полный CI pipeline

name: Full CI

on:
  pull_request:
    branches: [main]

jobs:
  quality:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - uses: actions/setup-node@v4
        with:
          node-version: '20'
          cache: 'npm'
      - run: npm ci
      - run: npm run lint
      - run: npx tsc --noEmit
      - run: npm test -- --coverage
      - run: npm run build

Автоматическое обновление зависимостей (Dependabot)

# .github/dependabot.yml
version: 2
updates:
  - package-ecosystem: npm
    directory: /
    schedule:
      interval: weekly
    open-pull-requests-limit: 10

Полезные actions

Action	Описание
`actions/checkout@v4`	Клонировать репозиторий
`actions/setup-node@v4`	Установить Node.js
`actions/cache@v4`	Кэширование зависимостей
`actions/upload-artifact@v4`	Сохранить артефакты сборки
`github/codeql-action`	Анализ безопасности кода

Статусные проверки (Status Checks)

GitHub позволяет сделать CI обязательным для мержа PR:

1.Settings → Branches → Branch protection rules

2.Require status checks to pass before merging

3.Выбрать нужные workflow (например, "test", "lint")

Теперь никто не сможет замержить PR, если CI красный. Это главная защита от багов в production.

Примеры

Минимальный CI workflow для Node.js проекта

name: CI

on:
  push:
    branches: [main, develop]
  pull_request:
    branches: [main]

jobs:
  ci:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - uses: actions/setup-node@v4
        with:
          node-version: '20'
          cache: 'npm'
      - run: npm ci
      - run: npm run lint
      - run: npm test
      - run: npm run build

Матрица версий Node.js в CI

jobs:
  test:
    runs-on: ubuntu-latest
    strategy:
      matrix:
        node-version: [18, 20]
    steps:
      - uses: actions/checkout@v4
      - uses: actions/setup-node@v4
        with:
          node-version: ${{ matrix.node-version }}
      - run: npm ci
      - run: npm test

📖

Теоретический урок

Изучи материал выше и задай вопросы AI если что-то непонятно

Этот урок содержит теоретическую информацию. Изучи материал, затем отметь урок как пройденный.

Загружаем AI-помощника...