Plataforma de Streaming - Suitch
Un clon de Twitch para practicar React, Astro y consumo de APIs reales.
Suitch nació como una forma de entender mejor cómo se construyen interfaces parecidas a Twitch usando datos reales. Me interesaba practicar React con una experiencia familiar: buscar streamers, navegar perfiles y mostrar contenido conectado con la API oficial.
Lo más valioso del proyecto fue enfrentarme a detalles que aparecen cuando una app deja de ser solo visual: autenticación, rutas dinámicas, estados compartidos, variables de entorno y las limitaciones reales de integrar contenido externo como los iframes de Twitch.
Tecnologías y decisiones
-
Astro Framework: Lo usé para organizar la app con rutas estáticas y dinámicas, manteniendo una base ligera y aprovechando Astro para servir solo el JavaScript necesario.
-
Tailwind CSS: Me ayudó a construir una interfaz responsiva con un ritmo visual parecido al de una plataforma de streaming, sin salir del flujo de componentes.
-
React: Lo usé para manejar interactividad, estado local y estado compartido entre componentes, sobre todo en la navegación y el comportamiento de la barra lateral.
Qué construí
- Construí rutas dinámicas para generar perfiles de streamers y entender mejor cómo preparar páginas a partir de datos externos.
- Trabajé con useState y useContext para compartir estado entre componentes sin complicar demasiado la arquitectura.
- Aprendí a lidiar con restricciones de CORS, iframes de Twitch y tokens de API mediante variables de entorno.
- El proyecto me ayudó a pasar de una UI estática a una experiencia conectada con servicios reales.