# 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)

## 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](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)