Building Your React App With Redux + Redux Thunk
Getting started with using Redux and Redux Thunk in your React app
As your react application gets larger, it gets harder and harder to keep track and maintain your states. This is where Redux can come in to help; it is a state management library that provides you with a central state (called the store), eliminating the need to pass props between components.
A quick run through of how Redux works:
- Create the store
- Passing in a reducer as an argument
- Reducer update states accordingly based on the type of actions that are dispatched
If you don’t already know what Redux is, I’ll recommend you to first read my other article on Redux here.
Getting Started
To get started, we first have to install three packages redux
, react-redux
, and redux-thunk
npm install redux react-redux redux-thunk
Note: redux is simply a JavaScript library that is used with UI frameworks like React and Vue.js while react-redux is a library that we need to use to connect react and redux together. As for redux-thunk, it is a middleware which I’ll explain more in detail in a bit