Learning Redux

Creating a DevTools component

We create a new DevTools container component, which will contain all the monitors that we want to use:

1. Create a new src/containers/DevTools.jsx file.
2. We first import React and the createDevTools helper function from redux-devtools:

import React from 'react'import { createDevTools } from 'redux-devtools'

3. Next, we have to import our monitors, in this case, the LogMonitor and DockMonitor:

import LogMonitor from 'redux-devtools-log-monitor'import DockMonitor from 'redux-devtools-dock-monitor'

4. Now, we can use the createDevTools helper function to create a DevTools component:

const DevTools = createDevTools(  <DockMonitor    toggleVisibilityKey='ctrl-h'    changePositionKey='ctrl-q'    defaultIsVisible={true}  > <LogMonitor ...