Requisitos previos
• Conocimientos básicos de JavaScript o TypeScript (variables, funciones, async/await).
• Conocimientos básicos de React (componentes, props, estado y hooks).
• Poder realizar instalaciones en el equipo (editor de código, extensiones y Bun)
• Ganas de practicar: vamos a construir varios proyectos y probar con múltiples navegadores.
• No necesitas experiencia previa con WebSockets ni con Bun.
Descripción del curso
Aprende a crear aplicaciones en tiempo real con un stack moderno y de alto rendimiento: Bun + WebSockets + React. En este curso vas a aprender, paso a paso y con proyectos reales, a construir aplicaciones que se actualizan al instante.
Dominarás desde el establecimiento de conexiones WebSocket sólidas (con manejo de conexión, desconexión, reconexión automática y eventos), hasta el desarrollo de un frontend en React capaz de consumir y emitir mensajes completamente tipados.
Arrancamos desde cero con los fundamentos de WebSockets y la implementación del servidor en Bun, incluyendo buenas prácticas para enviar/recibir mensajes, broadcast a canales, uso de cookies, query params y protección básica de la conexión.
Proyectos completos que construirás:
- Dashboard interactivo: Gráficas de partidos políticos con React + ChartJS alimentadas y actualizadas por WebSockets en vivo.
- Mapas en vivo: Mapas colaborativos con Mapbox, sincronización de movimientos y marcadores compartidos en tiempo real entre múltiples usuarios.
- Sistema de colas y tickets: Aplicación tipo atención al cliente con pantallas de visualización y actualización instantánea de turnos.
- Chat seguro y persistente: Mensajería global y privada con usuarios conectados, autenticación mediante JWT y almacenamiento en PostgreSQL + Prisma.
Arquitectura y herramientas profesionales:
Luego de las bases, escalaremos los proyectos aplicando patrones y herramientas esenciales para entornos de producción:
- Organización de código basada en handlers, services y stores.
- Validación estricta de datos con Zod.
- Tipado completo del payload para garantizar un código mantenible.
- Gestión de estado en React mediante Context API y hooks personalizados.
Al finalizar, tendrás la confianza y el criterio técnico para diseñar soluciones en tiempo real desde cero, combinando la velocidad de Bun en el backend con la flexibilidad de React en el frontend.
⚡ ¡Prepárate para construir la web síncrona y ultra veloz que demandan los usuarios de hoy!
