How to configure Redux DevTools to monitor state changes in async operations

Question

With the help of code can i know How to configure Redux DevTools to monitor state changes in async operations?

Answer 1

To configure Redux DevTools to monitor state changes in async operations:

Install Redux DevTools Extension in your browser.

Setup Store with DevTools Support:

import { createStore, applyMiddleware } from 'redux';

import thunk from 'redux-thunk';

import { composeWithDevTools } from 'redux-devtools-extension';

import rootReducer from './reducers';

const store = createStore(

  rootReducer,

  composeWithDevTools(applyMiddleware(thunk))

);

Dispatch Async Actions using middleware like redux-thunk.

DevTools Automatically Logs:

Each async action phase (REQUEST, SUCCESS, FAILURE).

Corresponding state changes in real-time.