DEV Community

Danarkey
Danarkey

Posted on

The react pokedex project

The final project of the front end web dev course with Academy Xi was to create a web app using react. There were a few requirements that also needed to be fulfilled to ensure that the knowledge that we learnt from the course was applied.

Requirements

  1. Create a single page application using create-react-app
  2. Have 5 components to ensure the code is organised
  3. Use React Router to have at least 3 client-side routes
  4. Include a nav bar or other UI navigation elements
  5. Use a json-server to create a RESTful API for the backend
  6. Add some styling to make it aesthetically pleasing

Starting off

Having just finished the phase 1 project which was using javascript to connect and fetch data from the pokemon API - I wanted to use that previous knowledge to my advantage.

I decided to create a new pokedex app but this time using react. During our online sessions we had discussed using hooks to add and remove entries from our db.json file to act as a favourites section.

My initial plan was to get the external smogon json movesets for each pokemon and apply that to each card for the pokemon. Allowing users to view competitive battle sets and save them for later. However my ambition got the best of me and ended delaying the final product where I had scrapped that functionality entirely.

Closing remarks

In the next post I'll go through my planning phase and how I set up the app initially and the styling choices I ended up going with.

Top comments (0)