Deploy y Entorno

Pipeline de despliegue

El deploy es automático al mergear un PR a main:

PR merged to main
  → GitHub Actions CI/CD
    → Descarga .env desde S3 (s3://alebat-env/inspiria-front-env/.env)
    → pnpm install
    → pnpm generate (genera archivos estáticos)
    → aws s3 sync .output/public/ s3://inspiriadental.com
    → CloudFront cache invalidation (distribution ERL499QI65U2Z)
    → Zoho webhook notification (notifica del deploy)

Tiempo total: ~3-5 minutos.

---

Infraestructura AWS

Recurso	Valor	Propósito
S3 Bucket	inspiriadental.com	Hosting de archivos estáticos
CloudFront	ERL499QI65U2Z	CDN global + HTTPS + caché
Region	eu-west-1 (Ireland)	Región principal
S3 env	s3://alebat-env/inspiria-front-env/.env	Variables de entorno del build

Por qué S3 + CloudFront (no un servidor)

• Sin servidor = sin mantenimiento de infraestructura
• Costo mínimo = solo pagas por almacenamiento + requests
• Performance = CDN con edge locations globales
• Escalabilidad = infinita (archivos estáticos)
• Seguridad = HTTPS automático, no hay superficie de ataque server-side

---

Variables de entorno

El archivo .env contiene configuración sensible que no está en el repositorio:

Variable (tipo)	Propósito
API URLs	Endpoints de Strapi (producción/desarrollo)
Stripe keys	Claves de API para pagos
Service tokens	Tokens de servicios externos
Feature flags	Activar/desactivar funcionalidades

Cómo obtener el .env para desarrollo local

1. Solicítalo al responsable del proyecto (@eduardolopsl)
2. Colócalo en la raíz del proyecto: verticals-subscription-ecommerce/.env
3. Nunca lo commitees (está en .gitignore)

En CI/CD

El GitHub Action descarga automáticamente el .env desde S3 antes del build:

aws s3 cp s3://alebat-env/inspiria-front-env/.env .env

---

Modo SPA (nuxt.config.ts)

ssr: false  // Single Page Application — no server-side rendering

Esto significa:

• El build genera archivos estáticos (HTML + JS + CSS)
• No hay servidor Node.js en producción
• Todo el rendering ocurre en el browser del usuario
• Las rutas se manejan client-side (history mode)
• CloudFront debe servir index.html para todas las rutas (SPA fallback)

---

Manual Chunks (optimización de bundle)

En nuxt.config.ts, Vite está configurado con chunks manuales para optimizar la carga:

vite: {
  build: {
    rollupOptions: {
      output: {
        manualChunks: {
          // Librerías grandes en chunks separados
          'vendor-vue': ['vue', 'vue-router', 'pinia'],
          'vendor-swiper': ['swiper'],
          'vendor-plyr': ['plyr', 'hls.js'],
          // etc.
        }
      }
    }
  }
}

Esto permite que el browser cachee las dependencias estables por separado del código de la app que cambia más frecuentemente.

---

Verificar un deploy

Tras mergear un PR:

1. Espera ~5 min a que el pipeline termine
2. Verifica en GitHub Actions que el job pasó (green check)
3. Visita https://inspiriadental.com
4. Haz hard refresh (Ctrl+Shift+R) para evitar caché del browser
5. Verifica la funcionalidad cambiada

Si algo está mal:

• Revisa los logs del GitHub Action
• Verifica que el .env tiene las variables correctas
• Comprueba la consola del browser por errores
• Haz una invalidación manual de CloudFront si el contenido está cacheado

---

Entornos

Entorno	URL	Cómo acceder
Desarrollo	localhost:3000	pnpm dev local
Producción	https://inspiriadental.com	Automático tras merge a main

No hay entorno de staging separado actualmente. Los PRs se verifican localmente antes de merge.