Nuestro stack: nada que ocultar
Esta es la infraestructura exacta sobre la que funciona este sitio. Cada elección está justificada y cada herramienta ha demostrado su valía. Los mismos estándares técnicos para todos nuestros clientes.
Framework front-end
Ecosistema maduro, renderizado concurrente para transiciones fluidas.
Seguridad en compilación, refactorizaciones sin sobresaltos, código autodocumentado.
HMR instantáneo en desarrollo. Desde la v8, el bundle lo genera rolldown y lo minifica oxc: esbuild ha salido del árbol de dependencias.
API declarativa, rutas cargadas bajo demanda, compatible con Suspense.
Estilos y design system
Sin runtime, purga automática, coherencia visual garantizada por los tokens.
- shadcn/ui (nueva pestaña)Componentes primitivos
Copiados en el repositorio: sin dependencias frágiles, código 100 % bajo control.
- Radix UI (nueva pestaña)Primitivas accesibles
ARIA correcto desde la instalación, navegación por teclado, captura del foco.
API declarativa, respeta prefers-reduced-motion, composición por GPU.
Tree-shaking, estilo coherente, más de 1500 iconos mantenidos.
Rendimiento
- Prerenderizado — Chromium sin interfazv149.0HTML servido completo
Todas las rutas del sitio (páginas de servicio, páginas locales y los 37 casos de estudio del portfolio) se renderizan durante el build en un Chromium sin interfaz. Antes, el servidor devolvía el mismo index.html vacío para todas: los robots que no ejecutan JavaScript solo veían los metadatos de la página de inicio.
- web-vitalsv6.1Monitorización RUM
LCP, INP y CLS medidos en usuarios reales y enviados a GA4.
- WOFF2 variable fontsTipografías
Outfit + Plus Jakarta Sans autoalojadas, subconjunto latino, font-display: optional.
- División manual de chunksCode splitting
Vendors separados (react, motion, radix, pdf) → caché a largo plazo óptima.
SEO y datos estructurados
- @dr.pogodin/react-helmetv3.2Meta por ruta
Title, description y Open Graph propios de cada página.
- Schema.org JSON-LDDatos estructurados
Organization, LocalBusiness, Service, FAQPage, HowTo, BreadcrumbList, Article.
- llms.txtOptimización GEO
Archivo dedicado a la indexación por ChatGPT, Claude, Perplexity y Gemini.
- Sitemap XMLRastreabilidad
Generado durante el build a partir de las rutas declaradas en App.tsx: nunca puede quedarse atrás respecto al sitio.
Back-end y datos
Postgres gestionado, Auth, Storage, Edge Functions: código abierto.
- Brevo (nueva pestaña)Formulario de contacto
Recibe los mensajes del formulario de contacto, transmitidos por una función serverless de Vercel.
- Resend (nueva pestaña)Emails transaccionales
Envía los presupuestos en PDF del configurador mediante una función de Supabase. Sin filtrado por IP en la API.
- Zodv4.4Validación en tiempo de ejecución
Esquemas tipados compartidos entre cliente y servidor, mensajes de error en francés.
Infraestructura y CI/CD
- Vercel (nueva pestaña)Alojamiento Edge
Despliegue con cada git push, CDN mundial, HTTP/3, ramas de previsualización.
- IONOS (nueva pestaña)Registrador y DNS
Dominios kayzen-lyon.com y .fr, zona DNS y correo electrónico.
- GitHubControl de versiones
Revisión de código e historial completo: es lo que alimenta el registro de cambios público.
- Service WorkerOffline-first
Caché estratégica de los recursos, página de respaldo /offline.html.
- Vitestv4.1Pruebas unitarias
Comparte la configuración de Vite, es decir, los mismos alias y el mismo pipeline que en producción.
- Playwrightv1.62Pruebas E2E
Recorridos críticos reproducidos en Chromium (escritorio) y en un perfil móvil Pixel 7.
Seguridad y cumplimiento
- Content-Security-PolicyAnti-XSS
script-src sin 'unsafe-inline': cada script inline se autoriza por su huella SHA-256, verificada durante el build.
- HSTS preloadAnti-downgrade
max-age de 2 años, includeSubDomains, lista de precarga de Chrome.
- Permissions-PolicyMínimo privilegio
Cámara, micrófono, USB y geolocalización desactivados por defecto.
- RGPD by designPrivacidad
Consent Mode v2, rechazo por defecto, GA4 cargado tras consentimiento explícito (sin GTM), encargados del tratamiento identificados.
Herramientas internas
- ESLintv10.8Linting
Reglas estrictas, verificación de los hooks, bloqueante en la CI.
- rollup-plugin-visualizerv7.0Análisis del bundle
Inspección gráfica de los chunks, detección de importaciones pesadas.
- PostCSSv8.5Build CSS
Autoprefixer, compatibilidad con navegadores modernos (objetivo es2020+).
- npmGestor de paquetes
package-lock.json es la referencia, y es lo que Vercel instala en cada despliegue.
Esta página está viva
Actualizamos esta lista con cada evolución importante. Consulte nuestro registro de cambios público para ver el historial completo de iteraciones, o nuestro design system para los tokens y componentes.
Hablemos de su infraestructura