Noctem Studio — Web Corporativa con CI/CD Automatizado
Tecnologías: Nuxt 4 · Vue 3 · TypeScript · Tailwind CSS v4 · Three.js · GSAP · GitHub Actions
Sitio web estático de alto rendimiento para Noctem Studio, un estudio de fotografía y contenido audiovisual con sede en Mallorca. Generado con Nuxt 4 en modo SSG, el sitio ofrece una experiencia visual cinematográfica con diseño de inspiración japonesa, animaciones scroll-driven con GSAP, y un modelo 3D interactivo de lente de cámara renderizado con Three.js.
Arquitectura y automatización:
Se implementó un pipeline de CI/CD completo con GitHub Actions que automatiza todo el ciclo de despliegue. Al hacer push a main, el workflow ejecuta pnpm install --frozen-lockfile con caché, genera el sitio estático con nuxt generate, y despliega por FTP a Hostinger en dos entornos diferenciados:
- Producción → noctemstudio.com
- Desarrollo → Subdominio independiente para validación previa
Este flujo de doble entorno garantiza que los cambios se verifican en un ring de desarrollo aislado antes de llegar a producción, eliminando el riesgo de despliegues manuales y reduciendo el tiempo de publicación a minutos.
Stack destacado:
- Nuxt 4 con @nuxt/image, @nuxt/icon, @nuxt/scripts y @nuxtjs/robots
- Tailwind CSS v4 vía @tailwindcss/vite con paleta oscura y acentos ámbar
- Three.js + GSAP para el modelo 3D del lente con animación ligada al scroll
- API proxy en Nitro con fallback offline completo (interfaces TypeScript + defaults embebidos)
- Pnpm con frozen-lockfile para builds reproducibles y deterministas
