TGViewer
Web Overflow 🇺🇦 Web Overflow 🇺🇦 @web_overflow · 3.79K subscribers
Post #959 7.69K
Як додати перевірку свого коду на GitHub Actions? 🌩️

Припустимо, що ваш застосунок написаний на JavaScript. Якщо ж ви використовуєте іншу мову, можете теж використовувати цей підхід, потрібно буде лише замінити скрипт перевірки. Отож, уявіть себе девопсом yaml-розробником і почнімо.

Власне, перед початком налаштовування GitHub Action ми зазвичай робимо ще одну річ - додаємо власний скрипт в package.json, який трохи спростить використання і запуск команди. Найчастіше ми додаємо там перевірку форматування через prettier та статичний аналіз з допомогою eslint та tsc. Виглядає це приблизно отак:

"scripts": {
"check": "prettier --check . && eslint . && tsc --noEmit"
}


Для початку в корені свого проєкту потрібно створити директорію .github, всередині якої ще одну з назвою workflows. Тут ми і будемо розміщувати свій файл конфігурації. Створимо цей файл і дамо йому назву check.yml.

Якщо ви не знайомі з YAML, це як JSON на Python. Головне слідкуйте за відступами.

Почнемо з імені, додайте у файл:

name: Run web check


Тепер треба прописати, коли ж запускати цей екшн. Дозволимо запускати його ручками та будемо автоматично запускати його при будь-якому пуші.

on:
workflow_dispatch: # вручну на GitHub
push: # при push в репозиторій


Почнімо ж нарешті описувати кроки перевірок. Створимо job з іменем check. Запускати це все ми будемо на останній ubuntu, а першим кроком додамо клонування вашого репозиторію.

jobs:
check:
runs-on: ubuntu-latest

steps:
- name: Checkout repository
uses: actions/checkout@v4


Отож, на цій машині вже є наш репозиторій. А на ubuntu одразу встановлений Node.js? Не знаємо, тому краще встановити його. На всяк випадок вкажемо версію Node.js. А ще, GitHub сам вміє кешувати модулі Node.js, тому скажемо йому робити це також.

- name: Setup Node.js 20
uses: actions/setup-node@v4
with:
node-version: 20
cache: 'npm'


Ну тепер Node.js точно є, але немає node_modules. Ну це вже дуже просто, всі ми знаємо потрібну команду.

- name: Install dependencies
run: npm install


Нарешті, все готово, залишилось тільки запустити нашу перевірку. Оскільки ми вже підготували потрібний скрипт, просто запустимо його.

- name: Run check
run: npm run check


Усе це разом, а також з невеличким налаштуванням pnpm, concurrency, strategy та монорепо (Node.js застосунок знаходиться не в корені проєкту), можна знайти за посиланням нижче.
👉 Відкрити файл

Щоб більше почитати про GitHub Actions використовуйте посилання внизу. А від @MatiGreen чекаємо повідомлення про те, як зробити те саме на GitLab 😉
👉 Відкрити посилання

#article
  • 👍 14
  • ❤ 6
  • 🔥 6
More from @web_overflow
  1. Oct 15, 2026Я сьогодні
  2. Sep 9, 2026Як вам жабка за 2к? 😁
  3. Aug 24, 202635 років Незалежності України 🇺🇦 Сьогодні хочеться просто побажати нам берегти своє, цін…
  4. Aug 3, 2026Трохи випали з ефіру, але не переживайте, у нас усе стабільно: Юра багато працює, а Настя…
  5. Jul 1, 2026До кінця тижня ми не знаємо хто цей ваш АІ 🌿
  6. Jun 19, 2026Не оновлюйте поки свою версію Node.js 😳 Зарелізив я, значить, учора 2 UI-апдейти, після я…
Threads Profile ViewerView any public Threads profile without an account.Open ThreadLook →Writing with AI? Make it sound human.Metric37 rewrites AI drafts so they read naturally. Free AI detector, 1,500 words free.Try Metric37 →