Aplicación web de los personajes de Rick and Morty. Desarrollada por Alicia Ripoll para el Módulo 3: REACT
La web contiene las siguientes funcionalidades:
En primer lugar, vamos a realizar una web con el listado de personajes de Rick and Morty. Para eso, vamos a utilizar el servicio de https://rickandmortyapi.com/documentation/#get-all-characters que nos devuelve información sobre los primeros 20 personajes de la serie. Sobre cada uno, vamos a pintar al menos:
- Foto
- Nombre
- Especie
Ahora que ya tenemos el listado de personajes en pantalla, la segunda parte consiste en poder buscarlos por nombre. Para eso, añadimos un input a la interfaz, de forma que al ir escribiendo un nombre queden en la interfaz solo los personajes cuyo nombre contiene las letras escritas.
El listado contiene:
- Componente para el filtro de nombre.
- Componente para el filtro de especie.
- Componente para el listado.
- Componente para la tarjeta de cada personaje del listado.
- Componente para el detalle de cada personaje.
Utilizando las rutas dinámicas, al hacer clic sobre la tarjeta de un personaje, su información aparecerá a pantalla completa. Para hacer esto usaremos rutas y React Router DOM. En la pantalla de detalle aparece además de la foto, nombre y especie, el planeta de origen, el número de episodios en los que aparece y si está vivo o muerto.
- Si el usuario busca un personaje que no existe, aparece en la pantalla un mensaje de aviso.
- Cuando el usuario escribe en el input, el filtrado admite tanto minúsculas como mayúsculas.
- Se ha agregado un favicon a la página web.