Member-only story
Okay, so you’ve got the basics of React down-pat and you know how to pass props down to components. As you add more and more child-components, it can complicate how you pass props down through mulitple components. Redux is an easy solution.
Redux is esentially a way of storing a global state that can be made accessible to any component without having to be passed down through multiple parent components. The way I see it, there are two parts to Redux. The first part is being able to store the global state and the second is being able to access the global state.
Let us first define some Redux terminology.
Store — a plain old javascript object that contains methods to interact with the global state
Reducer — javascript function who’s return value becomes the new global state
Action — a plain old javascript object that contains information that will tell the reducer what to do
Dispatch — function that will send an action to the reducer, which will be executed
For big projects, I like to this redux devtool for chrome. It allows you to use a chrome plugin to view the global state at all times during the app. We will need to add one snippet of code to get it working. It’s easy to set up and makes our lives easier too.
