CI/CD für JavaScript-Projekte: GitHub Actions von A bis Z

Einleitung: Warum CI/CD für JavaScript-Projekte unverzichtbar ist

Moderne Webentwicklung ist ohne Automatisierung undenkbar. Jeden Tag stehen JavaScript (Node.js)-Entwickler vor Routineaufgaben: Tests ausführen, Code mit einem Linter prüfen, die Anwendung bauen und bereitstellen. Diese Vorgänge manuell durchzuführen, kostet nicht nur Zeit, sondern ist auch anfällig für Fehler. Hier kommt CI/CD (Continuous Integration / Continuous Deployment) zur Rettung — eine Methodik, die es ermöglicht, alle Phasen des Softwarelebenszyklus zu automatisieren.

GitHub Actions ist ein integriertes Automatisierungstool auf der GitHub-Plattform, ideal für die Einrichtung von CI/CD-Pipelines. In diesem Artikel werden wir Schritt für Schritt durchgehen, wie man einen vollständigen Automatisierungszyklus für ein JavaScript (Node.js)-Projekt von Grund auf einrichtet: vom Ausführen von Tests bis zum Deployment auf einem Server. Sie lernen, wie Sie einen Workflow erstellen, Konfigurationsdateien schreiben und häufige Fehler vermeiden.

Grundlagen von GitHub Actions: Struktur und Komponenten

Bevor wir Code schreiben, lassen Sie uns die Schlüsselkonzepte von GitHub Actions verstehen. Die gesamte Pipeline wird in YAML-Dateien beschrieben, die im Verzeichnis .github/workflows Ihres Repositorys gespeichert sind.

Schlüsselelemente eines Workflows

• Workflow — ein automatisierter Prozess, der aus einem oder mehreren Jobs besteht.
• Job — eine Reihe von Steps, die auf einem einzigen Runner (virtuellen Maschine) ausgeführt werden.
• Step — ein einzelner Befehl oder eine Action.
• Event — ein Auslöser, der den Workflow startet (z. B. Push, Pull Request).

Für JavaScript-Projekte sieht ein Standard-Workflow so aus:

name: CI/CD for Node.js

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

jobs:  build-and-test:    runs-on: ubuntu-latest        strategy:      matrix:        node-version: [18.x, 20.x]        steps:    - uses: actions/checkout@v4    - name: Setup Node.js      uses: actions/setup-node@v4      with:        node-version: ${{ matrix.node-version }}    - name: Install dependencies      run: npm ci    - name: Linting      run: npm run lint    - name: Tests      run: npm test

Beachten Sie das strategy.matrix — dies ermöglicht das gleichzeitige Testen des Codes mit mehreren Node.js-Versionen, was für Bibliotheken und Pakete entscheidend ist.

Schritt-für-Schritt-Einrichtung von CI/CD für ein Node.js-Projekt

Schauen wir uns ein vollständiges Beispiel für die Einrichtung einer Pipeline für eine typische Express.js-Webanwendung an. Beginnen Sie mit der Basisdatei .github/workflows/node-ci.yml.

Schritt 1: Grundlegende Code-Überprüfung

name: Node.js CI

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

jobs:  quality:    runs-on: ubuntu-latest        steps:    - uses: actions/checkout@v4        - name: Setup Node.js      uses: actions/setup-node@v4      with:        node-version: '20'        cache: 'npm'        - name: Install dependencies      run: npm ci        - name: Lint code      run: npm run lint        - name: Run unit tests      run: npm run test:unit        - name: Build project      run: npm run build

Wichtige Punkte:

• cache: 'npm' — speichert node_modules zwischen, was nachfolgende Ausführungen beschleunigt.
• npm ci — saubere Installation der Abhängigkeiten, schneller und zuverlässiger als npm install.
• Die Aufteilung der Tests in Unit- und Integrationstests (optional) ermöglicht ein schnelleres Feedback.

Schritt 2: Integrationstests mit einer Datenbank

Für Tests mit einer echten Datenbank verwenden Sie GitHub Actions Services:

jobs:  integration-tests:    runs-on: ubuntu-latest