See the Pen PokéAPI Rotomdex by Ethan McElvaney (@ewmcelvaney) on CodePen.
Note: If you are on a mobile device, it will work better if you go to this project’s page on CodePen and flip your device sideways.
What I Did
- Coded a web app that pulls Pokémon from an online database
- Designed a Pokédex interface for the web application to make
- Tools Used: HTML, CSS, JavaScript, Adobe Illustrator
The Need: To Learn How to Use Application Programming Interfaces
While I was learning web coding in graduate school, I needed to make an app in JavaScript. This app would pull information from an API database and then display it on a web page.
When I found out there was a Pokémon API, I decided what I wanted to do.
The Solution: A Pokédex Based on the Seventh Generation Design
The web app I made pulls up the name, Pokédex number, and the battle statistics of different Pokémon species. All the user needs to do is enter the number or name of the Pokémon in the search box.
This web app is based on the Rotomdex from Pokémon Sun and Moon. I wrote the error messages to reference how the Rotomdex speaks to the player in these games.
The Process
Originally, I was going to make a Galar region Pokédex since Pokémon Sword and Shield had just come out. I even drew a concept sketch of this idea.
However, the API did not have this information at the time. I didn’t have time to learn how to add it, so I based my design on the Rotomdex from Pokémon Sun and Moon.
After illustrating the Rotomdex in Adobe Illustrator, I coded the application in CodePen.
