Redux DevTools

The reason to accept Redux 3,824 's ceremony is visible the first time you open the DevTools tab. Because every change is a named action and every state is a new immutable object, the extension lists the actions in order, shows the diff each produced, jumps back to any earlier state, and exports the session as replayable JSON. Install it for Chrome 1 , Firefox 555 or Edge from the Redux DevTools 14,368 repository (https://github.com/reduxjs/redux-devtools 14,368 ); configureStore connects to it automatically.

const store = configureStore({
  reducer: rootReducer,
  devTools: process.env.NODE_ENV !== 'production' && {
    name: 'catalog',              // shown in the instance picker
    trace: true,                  // click an action to see the line that dispatched it
    actionsDenylist: ['keystroke/typed'],   // hide chatty actions
  },
});

Time travel is not a replay of your code: the extension re-runs the recorded action list through the reducers from the initial state, so it works only if the reducers really are pure. A reducer that reads Date.now() gives different results on the second pass — a discrepancy that is itself a useful bug report.