https://github.com/frontendmasters/react-state-management
https://github.com/frontendmasters/react-state-management
Last synced: 2 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/frontendmasters/react-state-management
- Owner: FrontendMasters
- Created: 2019-05-27T19:21:30.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2024-03-01T21:01:54.000Z (almost 2 years ago)
- Last Synced: 2025-01-10T10:58:14.874Z (11 months ago)
- Size: 4.88 KB
- Stars: 64
- Watchers: 10
- Forks: 42
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
> [!NOTE]
> This repo is from an archived version of the course. Watch the latest version of the course on [frontendmasters.com](https://frontendmasters.com/courses/react-performance/).
# 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](https://github.com/facebook/react-devtools)
- [Redux Developer Tools](https://github.com/zalmoxisus/redux-devtools-extension)
- [MobX Developer Tools](https://github.com/mobxjs/mobx-devtools)
## Respositories
Make sure to run `npm install` in each repository.
- [Simple Counter](https://github.com/stevekinney/simple-counter)
- [Dualing Counters](https://github.com/stevekinney/dualing-counters/)
- [Kanbananza](https://github.com/stevekinney/kanbananza)
- [Pizza Calculator](https://github.com/stevekinney/pizza-calculator-two)
- [Tweet Stream](https://github.com/stevekinney/tweet-stream-react)
- [Star Wars Autocomplete](https://github.com/stevekinney/star-wars-autocomplete)
- [Jetsetter](https://github.com/stevekinney/jetsetter-two)
- [Redux Counter](https://github.com/stevekinney/redux-counter)
- [MobX Counter](https://github.com/stevekinney/mobx-counter)
## RunKit Notebooks
Below are notebooks containing example code for working with state in Redux.
- [Rendezvous with Redux](https://runkit.com/stevekinney/rendezvous-with-redux)
- [Normalizr with Cards and Lists](https://runkit.com/stevekinney/5ce18d9fbd79a9001ab8d94c)
- [Immutably Set Properties on Objects with Lodash](https://runkit.com/stevekinney/5ce9a08dfa68f4001aabcdf3)
## APIs
We'll be using the following APIs in this workshop:
- [Star Wars Characters](https://star-wars-characters.glitch.me/)
- [Tweet Stream](https://tweet-stream.glitch.me/)
## Notes
- [Redux Live Coding Notes](https://gist.github.com/stevekinney/da64a2a3cda6ff0fe8d8f1b5303fe8d6)
## Code Sandbox Example Implementations
- [Simple Counter (Boilerplate)](https://codesandbox.io/s/m7vm5wqjoy)
- [Simple Counter (Basic State)](https://codesandbox.io/s/m4xq2j3p5j)
- [Simple Counter (Context API and Naïve Hooks)](https://codesandbox.io/s/k5m0lm3nr3)
- [Simple Counter (useContext)](https://codesandbox.io/s/18qqxmkx8j)
- [Simple Counter (Custom Hook)](https://codesandbox.io/s/omm3mpqm6)
- [Simple Counter (useReducer)](https://codesandbox.io/s/v39l639vn3)
- [Simple Counter (Redux)](https://codesandbox.io/s/r7z1y573qm)
- [useLocalStorage Hook](https://codesandbox.io/s/e4s2j)
- [useAjax Hook](https://codesandbox.io/s/29vhg)
- [Asynchronous State](https://codesandbox.io/s/6z2rkmx6k)
- [Asynchronous State (with Hooks)](https://codesandbox.io/s/zx54l1kzpl)
- [Basic MobX](https://codesandbox.io/s/k5nrxyowk3)
- [Basic MobX (with Object Literal)](https://codesandbox.io/s/olpnq8ykz9)
- [Fundamental MobX (Boilerplate)](https://codesandbox.io/s/mobx-boilerplate-us7wo)
- [Fundamental MobX](https://codesandbox.io/s/j2vlnovo05)
- [Fundamental MobX (with Decorators)](https://codesandbox.io/s/m5po6p0jr8)
- [Tweet Stream (Boilerplate)](https://codesandbox.io/s/70mdp)
- [Tweet Stream (Redux Thunk)](https://codesandbox.io/s/d6q8x)
- [Tweet Stream (Redux Observable)](https://codesandbox.io/s/2w7km)