Ingeniero FrontendAvanzado8 módulos~4.0 horas prácticas3 modos de aprendizaje
Production Frontend Capstone
Construí Pulseboard, un SaaS seguro de feedback de clientes que integra prácticas de arquitectura, accesibilidad, testing, performance y entrega en una aplicación Next.js lista para producción.
// Lo que podrás hacer- Arquitectura, contratos de entorno y modelado de amenazas
- Migraciones reproducibles, datos seed y autorización aplicada por la base de datos
- Sesiones con cookies, rutas protegidas y una bandeja de entrada de feedback renderizada en el servidor
- Mutaciones validadas, feedback optimista, seguridad ante concurrencia y un registro de auditoría
8 módulos, hechos para ejecutar
Cada módulo incluye código ejecutable. Expande cualquiera para ver su contenido.
00IntroducciónEl problema de producción y el estado final de Pulseboard30 min
Preguntas que responde este módulo
- ¿Cómo podés reconocer los riesgos transversales que un frontend en producción tiene que controlar?
- ¿Cómo podés elegir un camino de aprendizaje para el capstone?
Empezar móduloVista previa gratis
01Límites de producciónArquitectura, contratos de entorno y modelado de amenazas30 min
Preguntas que responde este módulo
- ¿Cómo podés crear una base de Next.js App Router con versiones exactas?
- ¿Cómo podés hacer cumplir reglas de entorno y dependencias con chequeos ejecutables?
02Propiedad de los datos y seguridad a nivel de filaMigraciones reproducibles, datos seed y autorización aplicada por la base de datos30 min
Preguntas que responde este módulo
- ¿Cómo podés modelar workspaces, membresías, perfiles y feedback con propiedad explícita?
- ¿Cómo podés aplicar aislamiento por tenant con políticas RLS y concesiones explícitas?
03Flujo de trabajo del panel autenticadoSesiones con cookies, rutas protegidas y una bandeja de entrada de feedback renderizada en el servidor30 min
Preguntas que responde este módulo
- ¿Cómo podés implementar los clientes SSR actuales de Supabase para cookies en Next.js 16?
- ¿Cómo podés refrescar y verificar sesiones con el `proxy.ts` raíz y `getClaims()`?
04Flujos de feedback accesiblesMutaciones validadas, feedback optimista, seguridad ante concurrencia y un registro de auditoría30 min
Preguntas que responde este módulo
- ¿Cómo podés implementar Server Actions autenticadas sin confiar en la identidad del navegador?
- ¿Cómo podés usar feedback optimista mientras preservás el estado autoritativo del servidor?
05Correo electrónico transaccional y webhooksEnviá notificaciones seguras ante reintentos y verificá eventos del proveedor30 min
Preguntas que responde este módulo
- ¿Cómo podés renderizar HTML transaccional seguro contra inyección?
- ¿Cómo podés enviar a través de Resend con claves de idempotencia estables?
06Probando el contrato de producciónEvidencia de tests unitarios, de componentes, de navegador, de accesibilidad, de rendimiento y de CI30 min
Preguntas que responde este módulo
- ¿Cómo podés probar la lógica pura y la accesibilidad interactiva con Vitest y Testing Library?
- ¿Cómo podés ejercitar el flujo del navegador sin sesión con Playwright?
07Síntesis de patronesMirá en acción: desplegalo, observá y recuperá Pulseboard30 min
Preguntas que responde este módulo
- ¿Cómo podés promover commits de GitHub a través de entornos de preview y production de Vercel?
- ¿Cómo podés usar observabilidad, rollback y un runbook practicado para operar los lanzamientos?
¿Listo para construir tu primer agente? Production Frontend Capstone?
Empezá con el Módulo 0 gratis y desbloqueá la ruta completa con un plan Pro.