Trello Clone — four state models
2025The same board app built four times over one API — plain React state, Context API, Redux Toolkit and Redux Toolkit in TypeScript — to compare state-management approaches against identical functionality.
The problem
Which state-management approach to reach for is usually argued in the abstract. I wanted the comparison grounded in one real app, where the feature set is identical and only the state layer changes.
What I built
- Implemented boards, lists, cards, checklists and drag-and-drop against the official Trello API, with real-time sync and persistent cloud storage.
- Rebuilt the same app on four branches — plain React state, Context API, Redux Toolkit, and Redux Toolkit in TypeScript — each a complete working implementation rather than a sketch.
- Typed the store, actions and API responses in the TypeScript branch to see what the type layer actually catches once the app is non-trivial.
Outcome
Four deployable branches over one API, and a first-hand read on where Context stops scaling and where Redux Toolkit starts paying for itself.
