Skip to content

Instantly share code, notes, and snippets.

@rpdecks
Created June 18, 2020 20:38
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save rpdecks/3af8415c638c95e24ff551364da27902 to your computer and use it in GitHub Desktop.
Save rpdecks/3af8415c638c95e24ff551364da27902 to your computer and use it in GitHub Desktop.
Redux level up
@033020 Hey everyone, here are those Flatiron Redux resources (this is going to be long :persevere:):
To prepare for Redux, please read the following pages in the official documentation:
- https://redux.js.org/introduction/motivation
- https://redux.js.org/faq/general#general-when-to-learn
- https://redux.js.org/faq/organizingstate#organizing-state-only-redux-state
- Just the first one about state.
- https://redux.js.org/faq/performance#performance-scaling
- Just the first one about scaling.
If you're really itching to get started, you can follow the tutorial series by the master himself, Dan Abramov, linked in the Learning Resources section of the docs:
- Getting Started with Redux - Video Series: https://egghead.io/series/getting-started-with-redux
- Course Notes - https://github.com/tayiorbeii/egghead.io_redux_course_notes
Plus checkout any other other tutorials there as well. For looking at code, check out the Examples and Miscellaneous page:
- https://redux.js.org/introduction/examples
- https://redux.js.org/faq/miscellaneous#miscellaneous-real-projects
Finally, for some history on Redux:
- Original Redux intro video by Dan Abramov at react-europe 2015 - https://www.youtube.com/watch?v=xsSnOQynTHs
In lieu of labs, I want y'all to think about the following:
- How are all of the following related to each other?
- `store`, `createStore`, `reducer`, `action`, `dispatch`, `state`
- Can you draw out a map relating all of them?
- Can you define each word? For example:
- What is an `action`? Why does an `action` have a `type`?
- What do each of those words translate to in plain JavaScript? For example:
- An `action` is an object with keys and values. One of those keys is...
- BONUS: Can you write out code using all of the above in your `index.js` starting with:
import { createStore } from 'redux';
// Your code goes here.
ReactDOM.render(..........)
These are baseline key concepts for understanding Redux and if you can loosely map these out in your mind, when we connect Redux to React in our next lecture, things will make a ton of sense. Talk to each other, play with the code, and be ready to Redux! :sunglasses:
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment