1 / 29 / 2024 - 3:28 PM
Pokémon API Challenge
I used my knowledge of HTML, CSS, and JS to create my own functioning and responsive Pokédex styled with the Tailwind CSS Framework, with the following features:
- Display 1st - 5th Gen Pokémon [x]
- Search for Pokémon by name and Pokedex Number [x]
- Ability to get a Random Pokémon [x]
- Display both images of Pokémon and Shiny Form [x]
- Display Pokémon Name [x]
- Show 1 location from any game [x]
- Display Element Types [x]
- List all possible abilities and moves [x]
- Show Evolutionary Paths [x]
- Display Favorites List[x]
Peer Reviewed by Elizabeth Trotter:
This is a very cool application that functions smoothly and is responsive for all screen sizes! I did notice a couple of issues during testing. The "Bug" type badge did not show an image or alt tag for those types of Pokemon. Also, the favorites functionality has some quirks. If I open the favorites drawer and I delete Pokemon other than the current Pokemon displayed, the current Pokemon "+" icon will change into a "-" icon despite that not being the Pokemon that was deleted. When returning to the favorites drawer again, the favorite Pokemon that were deleted previously are occasionally stil showing. The +/- icon indicator is sometimes not always accurate to what is listed in the favorites as a result.
Figma Link: https://www.figma.com/file/WV74uhcLUkndP4QDhvLvls/Pokemon-API-Challenge?type=design&node-id=0%3A1&mode=design&t=VMZhmwrsfZ1Vij1H-1
Azure Link: https://pokemonapichallenge.azurewebsites.net/