Marvel Explorer
Explorador de personajes y cómics de Marvel hecho con Vue 3 y TypeScript, siguiendo el capítulo de integración con APIs de un libro de Vue.js 3.
vuetypescripttailwindcss
Actualización: Marvel descontinuó su API pública de cómics a finales de 2025, así que la integración en vivo de la que depende este proyecto ya no funciona. El código, el composable y los aprendizajes de abajo siguen siendo exactamente lo que construí.
Qué es
Un explorador del universo Marvel: buscar personajes, curiosear sus cómics y pasar páginas de resultados. Sigue el capítulo 4 de Building Real-World Web Applications with Vue.js 3 (Packt), el capítulo dedicado a conectar una app Vue 3 con una API de terceros real en vez de datos simulados en local, justo después de Yet Another Todo List.
Stack
Vue 3 con la Composition API, TypeScript, Vite, Vue Router y Tailwind CSS. Un composable marvelApi envuelve todas las llamadas a la API de Marvel, con las respuestas tipadas de principio a fin (src/types/marvel.ts) para que los componentes trabajen con formas reales en vez de JSON suelto.
Aprendizajes
Sacar todas las llamadas a la API a un único composable (marvelApi.ts) es lo que permitió reutilizar la paginación, la carga y los estados de error entre la vista de búsqueda y la de inicio, en vez de duplicarlos en cada una. También es el proyecto donde tipar la respuesta de una API de terceros dejó de parecer opcional (la forma anidada data.results[] de la API de Marvel es justo el tipo de cosa que rompe una plantilla en silencio si TypeScript no la está vigilando).