How to use redux thunk in React and React Native

We are gonna explain how redux middleware work, then use redux thunk.

“turned on Acer laptop on table near cup” by Anete Lūsiņa on Unsplash

So before doing any code, how does redux middleware works?

Redux middleware is how you would handle asynchronous operations. Since redux operates synchronously, you would need middleware to handle asynchronous operations since you would handling promises, callbacks and async and await. We will create a react native and react app.

react-native init starwarsApiAppAND
npx create-react-app star-wars-api-app
npm i redux-thunk redux react-redux axios superagent
mkdir redux
touch reducer.js store.js
Set our intialState, action types, and our reducer.
Define your fetchData action creator that sets your loading state to true.
Define your fetchDataFulfilled action creator which will set our people array with data and set loading to false.
Define your fetchDataReject which handles errors.
Import needed methods.