De Push a Producción: CI/CD para Proyectos Vue.js + Node

Implementación Básica

Ejemplo funcional que podés implementar en una tarde.

1. Dockerizar la Aplicación

# Dockerfile
FROM node:18-alpine as build

WORKDIR /app
COPY package*.json ./
RUN npm ci

COPY . .
RUN npm run build

FROM nginx:alpine
COPY --from=build /app/dist /usr/share/nginx/html
COPY nginx.conf /etc/nginx/nginx.conf

EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]

2. Configurar nginx

# nginx.conf
server {
    listen 80;
    root /usr/share/nginx/html;
    index index.html;

    location / {
        try_files $uri $uri/ /index.html;
    }
}

3. Pipeline GitHub Actions

# .github/workflows/deploy.yml
name: Deploy to Production

on:
  push:
    branches: [ main ]

jobs:
  test:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v3
      
      - name: Setup Node
        uses: actions/setup-node@v3
        with:
          node-version: '18'
      
      - name: Install dependencies
        run: npm ci
      
      - name: Run tests
        run: npm test

  build-and-deploy:
    needs: test
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v3
      
      - name: Build Docker image
        run: docker build -t myapp:latest .
      
      - name: Deploy to server
        uses: appleboy/ssh-action@master
        with:
          host: ${{ secrets.SERVER_HOST }}
          username: ${{ secrets.SERVER_USER }}
          key: ${{ secrets.SSH_KEY }}
          script: |
            cd /app
            docker pull myapp:latest
            docker-compose up -d --force-recreate

Configuración del Servidor

# docker-compose.yml en el servidor
version: '3.8'
services:
  app:
    image: myapp:latest
    ports:
      - "80:80"
    restart: always

Resultado

Con esta configuración:

• ✅ Push a main → deploy automático
• ✅ Tests ejecutados antes del deploy
• ✅ Docker garantiza consistencia
• ⏱️ Deploy completo en ~5 minutos

---

Nivel Enterprise

Para producción real se necesitan capas adicionales:

1. Múltiples Ambientes

Desarrollo → Staging → Producción

• Variables de entorno por ambiente
• Bases de datos separadas
• Proceso de aprobación entre stages

2. Optimizaciones

• Básico: Build completo cada vez (~8 min)
• Profesional: Cache de dependencias (~2 min)

3. Rollback Automático

• Health checks post-deploy
• Rollback si fallan las verificaciones
• Notificaciones automáticas
• Logs detallados

4. Secrets Management

Gestión profesional de credenciales con GitHub Secrets, rotación automática y acceso auditado.

5. Monitoreo

• Métricas en tiempo real (Prometheus + Grafana)
• Logs centralizados
• Alertas automáticas
• Dashboards customizados

6. Zero-Downtime Deployments

Blue-green deployments, rolling updates, sesiones de usuario preservadas.

---