middleware: Redux middleware provides a third-party extension point between dispatching an action, and the moment it reaches the reducer. People use Redux middleware for logging, crash reporting, talking to an asynchronous API, routing, and more.
thunk: Redux Thunk is a middleware that allows you to call the action creators that return a function(thunk) which takes the store’s dispatch method as the argument and which is afterwards used to dispatch the synchronous action after the API or side effects has been finished.
The Redux Toolkit package is intended to be the standard way to write Redux logic. It was originally created to help address three common concerns about Redux:
It includes several utility functions that simplify the most common Redux use cases, including store setup, defining reducers, immutable update logic, and even creating entire “slices” of state at once without writing any action creators or action types by hand. It also includes the most widely used Redux addons, like Redux Thunk for async logic and Reselect for writing selector functions, so that you can use them right away.
The Redux core library is deliberately unopinionated. It lets you decide how you want to handle everything, like store setup, what your state contains, and how you want to build your reducers.
This is good in some cases, because it gives you flexibility, but that flexibility isn’t always needed. Sometimes we just want the simplest possible way to get started, with some good default behavior out of the box. Or, maybe you’re writing a larger application and finding yourself writing some similar code, and you’d like to cut down on how much of that code you have to write by hand.
Redux Toolkit includes the following APIs… These APIs were created to supply logic and avoid repetition.
configureStore()createReducer()createAction()createSlicecreateAsyncThunkcreateEntityAdapterReferences:
@By Andy Noelker/Correct way to pre-load component data in react+redux
@By Andrea Chiarelli/Async actions in Redux with Thunk or custom middleware
@By redux/What is Redux Toolkit?