🔄 CI/CD Pipeline

Este directorio contiene toda la configuración de CI/CD para el proyecto accessibility-ui.

📁 Estructura

.github/
├── workflows/
│   ├── ci.yml              # Pipeline principal de CI/CD
│   ├── docker.yml          # Build y testing de imágenes Docker
│   ├── release.yml         # Proceso de release automático
│   └── dependencies.yml    # Actualización automática de dependencias
├── CODEOWNERS              # Propietarios de código
└── pull_request_template.md # Template para Pull Requests

🚀 Pipelines Configurados

1. CI/CD Principal (ci.yml)

Triggers:

• Push a main, master, develop
• Pull Requests a main, master

Jobs:

• ✅ Test & Quality: Type checking, lint, tests, cobertura
• 🏗️ Build & Validate: Build de aplicación y validación
• 🐳 Docker Build: Construcción de imágenes Docker
• 🔒 Security Scan: Audit de dependencias y scan de vulnerabilidades
• 🚀 Deploy Preview: Deploy de previews para PRs
• 🚀 Deploy Production: Deploy a producción
• 🔍 Lighthouse: Tests de performance y accesibilidad

2. Docker (docker.yml)

Triggers:

• Push a main, master
• Tags v*
• Pull Requests

Features:

• Build multi-target (development/production)
• Cache optimizado
• Security scanning con Trivy
• Testing de imágenes

3. Release (release.yml)

Triggers:

• Tags v* (ej: v1.0.0)

Features:

• Creación automática de releases
• Generación de changelog
• Build de artefactos
• Deploy a producción
• Imágenes Docker multi-plataforma

4. Dependencies (dependencies.yml)

Triggers:

• Schedule: Lunes 9:00 AM UTC
• Manual trigger

Features:

• Actualización automática de dependencias
• Tests de compatibilidad
• Creación de PRs automáticos
• Security audit continuo

🔧 Configuración Requerida

Secrets de GitHub

# Codecov (opcional)
CODECOV_TOKEN=your_codecov_token

# Snyk Security (opcional)
SNYK_TOKEN=your_snyk_token

# Netlify Preview (opcional)
NETLIFY_AUTH_TOKEN=your_netlify_token
NETLIFY_SITE_ID=your_site_id

Variables de Repositorio

# URLs de servicios
VITE_GATEWAY_URL=http://localhost:8080
VITE_MW_URL=http://localhost:3001

📊 Métricas y Calidad

Coverage Requirements

• Mínimo: 70%
• Target: 80%
• Threshold: 1% (tolerancia de bajada)

Performance Budgets (Lighthouse)

• Performance: ≥80%
• Accessibility: ≥90%
• Best Practices: ≥80%
• SEO: ≥80%
• LCP: ≤4s
• CLS: ≤0.1

Security

• Audit automático de dependencias
• Scan de vulnerabilidades en imágenes Docker
• Bloqueo por vulnerabilidades críticas/altas

🔄 Flujo de Trabajo

Development

1. Create feature branch
2. Make changes
3. Push → Ejecuta CI completo
4. Create PR → Deploy preview + Lighthouse
5. Review & merge

Release

1. Create tag git tag v1.0.0
2. Push tag git push origin v1.0.0
3. Automático → Release + Docker images + Deploy

Maintenance

• Dependencias actualizadas automáticamente cada lunes
• Security audit continuo
• Alertas automáticas por vulnerabilidades

🐳 Docker Registry

Las imágenes se publican en GitHub Container Registry:

# Development
docker pull ghcr.io/magodeveloper/accessibility-ui:latest-development

# Production
docker pull ghcr.io/magodeveloper/accessibility-ui:latest-production
docker pull ghcr.io/magodeveloper/accessibility-ui:v1.0.0-production

🔍 Monitoring

GitHub Actions

• Status badges en README
• Notificaciones de fallos
• Logs detallados de cada job

Coverage

• Codecov integration
• Coverage reports en PRs
• Trending histórico

Performance

• Lighthouse CI reports
• Performance budgets enforcement
• Regression detection

🛠 Comandos Locales

# Simular CI localmente
npm run type-check
npm run lint
npm run test:coverage
npm run build

# Docker local
npm run docker:build
npm run docker:dev

# Security
npm audit
npm audit fix

📝 Configuración Adicional

• Codecov: .codecov.yml
• Lighthouse: lighthouse.config.js
• Otras plataformas: .ci/additional-platforms.md

🔗 Enlaces Útiles

• GitHub Actions Documentation
• Docker Build Push Action
• Lighthouse CI
• Codecov