Summary
In this chapter, we built a small one-page app that contained components that needed to share state. We started by using our existing knowledge and used props to pass the state between the components. We learned that a problem with this approach was that components not needing access to the state are forced to access it if its child components do need access to it.
We moved on to learn about React context and refactored the app to use it. We learned that React context can store state using useState
or useReducer
. The state can then be provided to components in the tree using the context’s Provider
component. Components then access the context state via the useContext
hook. We found that this was a much nicer solution than passing the state via props, particularly when many components need access to the state.
Next, we learned about Redux, which is similar to React context. A difference is that there can only be a single Redux store containing the state, but there...