Rick and Morty buscador de personajes - REACT

Ejercicio consistente en el desarrollo de una página web con el listado de personajes de Rick and Morty donde se podrá filtrar por el nombre del personaje.

Ver Ejercicio

Tecnologías

🔸HTML
🔸CSS
🔸Saas
🔸JavaScript
🔸React
🔸GULP + Starterkit proporcionado por Adalab
🔸GitHub Pages

Puntos Claves

✅ Llamada a una API
✅ Búsqueda en API
✅ Paginación
✅ Estructura de componentes
✅ Uso métodos funcionales de array
✅ Uso eventos en React
✅ Uso Hooks para las peticiones al servidor
✅ Uso React Router
✅ Diseño mobile first

Especificaciones del ejercicio

📍Se deben listar los personajes de Rick and Morty, para ello utilizaremos el siguiente servicio:

https://rickandmortyapi.com/documentation/#get-all-characters

📍Sobre cada uno, vamos a pintar al menos:

• Foto
• Nombre
• Especie
• Filtrado de personajes. Incluir un input a la interfaz de forma que al ir escribiendo un nombre queden en la interfaz solos los personajes cuyo nombre contiene las letras escritas.
• Crear como minimo los componentes para filtro de nombre, listado, tarjeta de cada personaje y detalle.
• Creación de una página de detalle del personaje utilizando React Router DOM. En esta pantalla aparecerá la foto, nombre, especie, planeta de origen, número de episodios en los que aparece y si está vivo o muerto.

💫Bonus

• Mostrar la especie
• Mostrar si un personaje está muerto con un icono
• Web responsive
• Ordenación de los personajes alfabeticamente por nombre
• Creación de un nuevo filtro para poder buscar por especie

🛫 Mejoras personales sobre el ejercicio

• Páginación

Arranque del proyecto

Para arrancar el proyecto, descarga el repositorio y ejecuta la siguiente línea en tu terminal, para instalar la carpeta node modules.

npm install

Para poder visualizar la página en el navegador ejecuta:

npm start

En la carpeta src puedes encontrar los archivos del desarrollo del proyecto En la carpeta docs se encuentran los archivos subidos en GitHubPages