This project is a Coding Challenge for a Lindy Labs opportunity. The requirements for this Code Challenge are:
- Have a web page that allows a user to enter a Pokémon name;
- In my case, I create a grid to show all Pokémons;
- If you don't have any filter, you will see 9 Pokémons when start, and if you want you can load 9 more each time you press Load more Pokémons button.
- When submitting, query https://pokeapi.co and display the given
Pokémon (at least name, number, and sprite), or an error message if no
match is found;
- When you make a search, the first thing I do is validate if my state contains any Pokémon to match with id or name. If not, make a request to PokeApi;
- When returning one result, the modal with details will open automatically.
- Provide “Previous” & “Next” buttons, that switch to the previous/next Pokémons, based on their id number;
- Provide a text-based search feature, where inputting a name or partial the name should look for a matching Pokémon and show it;
- Have at least two automated tests, for the two features above;
- IMPROVEMENT: This point is an improvement to learn new skills and finish all requirements on this challenge.
These 3 points are essential for each project I do!
- ESLint configuration;
- Use my package
.
- Use my package
- Add Husky and Lint Staged to run on each commit;
- Add Commit Lint to follow the guidelines on commit messages;
To run this project, you will need to add the following environment variables to your .env file:
VITE_API_URL: PokeApi Url (https://pokeapi.co/api/v2/)
