Pokemon React

Intro

I decided at one point that my knowledge of React wasn't good enough. Anyone can potter through making a React app, but my goal was a much better understanding of the underlying architecture.

The PokeAPI exists in an almost horrifying level of detail, and I'd wanted to use it in some capacity for some time.

Site

Link: pokemon.malyaris.com

Implementation

• React (functional components + useContext global state)
• Emotion
• PokeAPI

React is not the right choice for this (at least not the way I did it). Game state is user-input dependent, which makes keeping state synced with input a callback-hell-prone affair. I knew that going in — the point was to run head-first into every problem so I'd really understand why things were breaking.

Design

All input data, game state, events and machinations are data-driven and built to be as reusable as possible. Initial data is cached to avoid hammering the PokeAPI, and long-term game state is stored in local storage and saved each time the context reducer updates.