CI/CD para proyectos JavaScript: GitHub Actions — guía completa

Introducción: Por qué CI/CD es esencial para proyectos JavaScript

Desarrollar una aplicación JavaScript moderna en Node.js es un proceso complejo que incluye escribir código, probar, compilar e implementar. Sin automatización, estas etapas se realizan manualmente, lo que genera errores, retrasos y una reducción en la calidad del producto. CI/CD (Integración Continua / Entrega Continua) es una práctica de DevOps que automatiza la compilación, prueba e implementación del código.

GitHub Actions es una herramienta integrada de GitHub que permite crear flujos de trabajo para la automatización de tareas. Es ideal para proyectos JavaScript, ya que admite Node.js, npm, Yarn y muchos servicios populares. En este artículo, analizaremos cómo configurar un pipeline CI/CD completo para tu proyecto JavaScript usando GitHub Actions.

Aprenderás: cómo ejecutar pruebas, cómo compilar la aplicación, cómo implementar en un servidor o plataforma en la nube y cómo evitar errores comunes.

Conceptos básicos de GitHub Actions para JavaScript

¿Qué es GitHub Actions?

GitHub Actions es una plataforma para automatizar flujos de trabajo. Describes una secuencia de pasos en un archivo YAML, que se coloca en el repositorio (normalmente .github/workflows/main.yml). Cada vez que ocurre un evento (por ejemplo, push, pull request), se activa el flujo de trabajo.

Un flujo de trabajo consta de jobs que se ejecutan en un runner (una máquina virtual). Para proyectos JavaScript, se suele utilizar un runner de Ubuntu con Node.js preinstalado.

Flujo de trabajo básico para Node.js

Comencemos con un flujo de trabajo simple que ejecuta pruebas en cada push o pull request. Crea un archivo .github/workflows/ci.yml:

name: CI для JavaScript

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

jobs:  test:    runs-on: ubuntu-latest

    strategy:      matrix:        node-version: [16.x, 18.x, 20.x]

    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'    - run: npm ci    - run: npm test    - run: npm run build --if-present

Este flujo de trabajo hace lo siguiente:

• Disparadores: se ejecuta al hacer push a main/develop o al hacer pull request a main.
• Matriz de versiones: prueba en Node.js 16, 18, 20, lo que garantiza compatibilidad.
• Almacenamiento en caché: cache: 'npm' acelera la instalación de dependencias.
• Comandos: npm ci (instalación limpia), npm test (pruebas), npm run build (compilación, si existe).

Configuración de un pipeline CI/CD completo

Ahora compliquemoslo un poco más: agreguemos linting, comprobaciones de seguridad e implementación automática después de pruebas exitosas.

Paso 1: Linting y formateo

Agrega un job para ESLint y Prettier. Esto garantiza un estilo de código consistente:

jobs:  lint:    runs-on: ubuntu-latest    steps:    - uses: actions/checkout@v4    - uses: actions/setup-node@v4      with:        node-version: '18.x'        cache: 'npm'    - run: npm ci    - run: npm run lint    - run: npx prettier --check .

En package.json, debe haber scripts "lint" y "format". Ejemplo:

{  "scripts": {    "lint": "eslint src/",    "format": "prettier --write ."  }}

Paso 2: Seguridad de dependencias

Usa npm audit para verificar vulnerabilidades:

  security:    runs-on: ubuntu-latest    steps:    - uses: actions/checkout@v4    - run: npm audit --audit-level=high

Si