Blog>
Snippets

Applying Redux DevTools Enhancements

Display code for integrating Redux DevTools with version 5, including any new features or configuration options that optimize development workflows.
import { createStore, applyMiddleware } from 'redux';
import { composeWithDevTools } from 'redux-devtools-extension';
import thunk from 'redux-thunk';
import rootReducer from './reducers';

const initialState = {};

// Middleware configuration
const middleware = [thunk];

// Store configuration with Redux DevTools
const store = createStore(
  rootReducer,
  initialState,
  composeWithDevTools(
    applyMiddleware(...middleware)
    // Add any additional Redux DevTools configurations here
  )
);

export default store;
This code snippet sets up a Redux store with the Redux DevTools extension. The 'composeWithDevTools' function is used to apply middleware (such as 'redux-thunk') alongside the Redux DevTools. The 'createStore' function then creates the store with the root reducer, initial state, and enhanced compose function including DevTools capabilities.