Welcoming all Rick & Morty fans to this project that renders character's info from Rick and Morty's API. You can filter these characters by two criteria: by name and by species. And if you click on any character, you can access an individual page for each of them that shows more details like their species, number of episodes they're in, status, etc.
This project is divided by components:
App.js
: main component that controls all the others and the main logic of the app.CharacterDetail.js
: renders the individual page for each character with all their details.CharacterCard.js
: renders the basic information for one character.CharactersList.js
: renders the characters on the main page.FilterByName.js
: renders the input where the user can search via filter for a character.FilterBySpecies.js
: renders the checkboxes that the user can click filter by species.Filters.js
: component that renders all the filters in the page.Header.js
: renders the header image and title.
To make our app functional, we need two services:
Api.js
: contains the function that calls the API and returns the data from the server.localStorage.js
: contains functions necessary to manage the local storage in a easier way.
In the project directory, you can run:
Runs the app in the development mode.
Open http://localhost:3000 to view it in your browser.
The page will reload when you make changes.
You may also see any lint errors in the console.
Builds the app for production to the docs
folder.
It correctly bundles React in production mode and optimizes the build for the best performance.
The build is minified and the filenames include the hashes.
Your app is ready to be deployed!
I hope you enjoyed this proyect as much as I enjoyed coding it. Any feedback will be highly appreciated.