A repo containing different ways to manage state in React with simple examples.
You've heard about the Context API. You're ready to start using it. Here's a friendly step-by-step progression to using context to manage some portion of your state in your production app.
Each flavor of state management is under a separate branch:
- Component State (setState)
- Redux
- Context
- Nested Context
- Unstated (this is awesome ✨)
Checkout each branch one-by-one and run yarn run start
(or npm run start
) to see the app in action.
But Matt, I want to understand Context better! What can I do?
Well, you can read about some of the resources above ☝️. You can also try to extend the app in this repo by doing the following exercises:
- Extend the Context example to use a product category context to choose which type of products are rendered in the product list.
- Extend the Unstated example to use the a currency context like the one in the Nested Context example.
- Create a PR and fix my bad code.
- Follow me on Twitter.