Note

This repo is from an archived version of the course. Watch the latest version of the course on frontendmasters.com.

React State, Redux, and MobX

Here is everything you need to get rocking and rolling for the React State and Redux & MobX workshops. Make sure you give each repository a fresh git pull in the morning—just in case!

Install

Install these tools in your browser of choice. I'll be using Chrome during the workshop.

• React Developer Tools
• Redux Developer Tools
• MobX Developer Tools

Respositories

Make sure to run npm install in each repository.

• Simple Counter
• Dualing Counters
• Kanbananza
• Pizza Calculator
• Tweet Stream
• Star Wars Autocomplete
• Jetsetter
• Redux Counter
• MobX Counter

RunKit Notebooks

Below are notebooks containing example code for working with state in Redux.

• Rendezvous with Redux
• Normalizr with Cards and Lists
• Immutably Set Properties on Objects with Lodash

APIs

We'll be using the following APIs in this workshop:

• Star Wars Characters
• Tweet Stream

Notes

• Redux Live Coding Notes

Code Sandbox Example Implementations

• Simple Counter (Boilerplate)
• Simple Counter (Basic State)
• Simple Counter (Context API and Naïve Hooks)
• Simple Counter (useContext)
• Simple Counter (Custom Hook)
• Simple Counter (useReducer)
• Simple Counter (Redux)
• useLocalStorage Hook
• useAjax Hook
• Asynchronous State
• Asynchronous State (with Hooks)
• Basic MobX
• Basic MobX (with Object Literal)
• Fundamental MobX (Boilerplate)
• Fundamental MobX
• Fundamental MobX (with Decorators)
• Tweet Stream (Boilerplate)
• Tweet Stream (Redux Thunk)
• Tweet Stream (Redux Observable)