Esto es un simple ejemplo de como usar la API de marvel con redux para mostrar el listado de comics
La API de Marvel© limita a 3000 requests por dia, si no funciona posiblemente es que se han acabado las peticiones diarias. Si deseas hacerlo funcionar en tu maquina, deberas cambiar tus api keys en las variables de entorno. yo he dejado un archivo .env en la raiz donde podras cambiarlo, esta no es la mejor manera, pero esto es solo un ejemplo
REACT_APP_API_PUBLIC_KEY=
REACT_APP_API_PRIVATE_KEY=
- Listado
- Mostrar titulo
- Ordenar (Sidebar)
- Filtrar (Pagina de busqueda)
- Detail Page
- Mobile Support
- Testing (in Progress🔄)
- User Interface
- Performance
- Utilización de Suspense y Lazy en la carga inicial.
- Service worker para cachear imagenes.
- Crear Image para cargar Thumbnail menor antes de la imagen principal.
- Coverage en pipeline travis
- Stados Staging y Production para deploys de app.
- ¿algo mas?
Esta aplicación ha sido pensada diseñada pensando en el concepto Mobile first con Sketch. Tiene como objetivo ser una SPA sin necesidad de utilización de React Router. Se ha creado un Styleguide acorde con el diseño de Marvel (rojo y blanco).
Una vez terminado con Sketch, pase el diseño a Zeplin ya que gracias a esta herramienta es mucho mas facil a la hora de maquetar.
Sabiendo que algunas cosas son mejorables, se ha intentado demostar la utilización de Redux y React Hooks, funcionalidad muy extendida en la comunidad react y otra bastante nueva. A su vez se ha intentado mostrar buenas practicas a la hora de consumir la API mediante paginación y la preparación para su filtrado y ordenado entre otras.
Se ha implementado un pipeline mediante travis en el que se ejecuta diferentes stages como seria la realización de los test y build del proyecto para posteriormente hacer el deploy en github pages y heroku.
