What Is Redux?
Redux introduces the following new concepts:
- Action Type
- Action Creator
- Store – Holds all the application’s state. It needs a reducer.
- Dispatch – The method we use to call for a state change.
- Action Type – A simple constant that holds the name of the action creator.
- Action Creator – A method that lets the reducer know what action we want to perform.
- Reducer – The main piece. Here we dictate the logic for changing the state.
We first create Action Type which is just a constant.
Then we create an Action Creator based on imported type. In the return we pass the Payload (new state). We can now create the initial state inside the Reducer and update it with the Payload based on Action Type.
Basically, every time we want to change the state, we dispatch an action, which will trigger the reducer logic to change the state.
React however, without react-redux node package, would not be able to communicate to the store.
This package introduces 2 handy React hooks:
We use this everytime we need the reducer’s state.
We use this everytime we want to change the reducer’s state.
Links our component with mapStatetoProps() and mapDispatchtoProps()
Redux is not extremely hard. It takes time to set it up, and perform your first 2 state changes. After that, it is actually fine.
But don’t worry i will help 🙂
Part 2 is a practical Redux post. I will show you how to set it up with React and Code those 2 state changes. Essentially all the hard parts. Stay Tune.
That was it!