Categories
Reactjs

Differences between redux, react-redux, redux-thunk?

redux: main library (independent from React)
redux-thunk: a redux middleware that helps you with async actions
react-redux: connects your redux store with ReactComponents

react-redux – bindings between redux and react. The library offers a set of react hooks – useSelector(), and useStore() to get the data from the store, and useDispatch() to dispatch actions. You can also use the connect() function to create HoCs (higher-order components), that listen to the store’s state changes, prepare the props for the wrapped component, and re-render the wrapped components when the state changes.

redux-thunk – middleware that allows you to write action creators that return a function instead of an action. The thunk can be used to delay the dispatch of an action or to dispatch only if a certain condition is met. Used mainly for async calls to API, that dispatch another action on success/failure.