# How to implement Redux DevTools?

**URL:** <https://forum.kirupa.com/t/how-to-implement-redux-devtools/639474>\
**Category:** Uncategorized\
**Created:** [March 6, 2019, 3:42pm UTC](https://forum.kirupa.com/t/how-to-implement-redux-devtools/639474 "2019-03-06T15:42:52Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![kayut](https://avatars.discourse-cdn.com/v4/letter/k/bcef8e/32.png) [@kayut](https://forum.kirupa.com/u/kayut)\
**Post date:** [March 6, 2019, 3:42pm UTC](https://forum.kirupa.com/t/how-to-implement-redux-devtools/639474/1 "2019-03-06T15:42:52Z")

</div>

This is the **index.js** inside the root folder :

```
import { createStore, applyMiddleware } from "redux";
import rootReducer from "./reducers/reducers";

const store = applyMiddleware(ReduxPromise)(createStore);

ReactDOM.render(
  <Provider store={store(rootReducer)}>
    <App />
  </Provider>,
  document.getElementById("root")
);

```

To be able to use Redux DevTools I need to add this line of code:

```
window. __REDUX_DEVTOOLS_EXTENSION__ && window. __REDUX_DEVTOOLS_EXTENSION__ ()

```

I tried this:

```
import { createStore, applyMiddleware, compose } from "redux";
import rootReducer from "./reducers/reducers";

const initialState = {};

const middleware = [ReduxPromise];

const store = createStore(
  rootReducer,
  initialState,
  compose(
    applyMiddleware(...middleware),
    window. __REDUX_DEVTOOLS_EXTENSION__ && window. __REDUX_DEVTOOLS_EXTENSION__ ()
  )
);

ReactDOM.render(
  <Provider store={store(rootReducer)}>
    <App />
  </Provider>,
  document.getElementById("root")
);

```

But then I get the error: **TypeError: store is not a function**

What am I doing wrong?

---

<div class="post-metadata">

**Author:** ![kirupa](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/kirupa/32/11616_2.png) [@kirupa](https://forum.kirupa.com/u/kirupa)\
**Post date:** [March 6, 2019, 3:57pm UTC](https://forum.kirupa.com/t/how-to-implement-redux-devtools/639474/2 "2019-03-06T15:57:20Z")

</div>

Does the example otherwise work if you remove the DevTools function call on the window object?

---

<div class="post-metadata">

**Author:** ![kayut](https://avatars.discourse-cdn.com/v4/letter/k/bcef8e/32.png) [@kayut](https://forum.kirupa.com/u/kayut)\
**Post date:** [March 6, 2019, 4:12pm UTC](https://forum.kirupa.com/t/how-to-implement-redux-devtools/639474/3 "2019-03-06T16:12:16Z")

</div>

The first code, without (ReduxDevTool) is working fine. But my code is not working.  
Please forget my code. How can I implement the Redux DevTools in the first code?

---

<div class="post-metadata">

**Author:** ![kirupa](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/kirupa/32/11616_2.png) [@kirupa](https://forum.kirupa.com/u/kirupa)\
**Post date:** [March 6, 2019, 8:33pm UTC](https://forum.kirupa.com/t/how-to-implement-redux-devtools/639474/4 "2019-03-06T20:33:01Z")

</div>

What npm package or documentation are you relying on? From my google search, there seem to be a handful of approaches for enabling the DevTools.

---

<div class="post-metadata">

**Author:** ![senocular](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/senocular/32/7217_2.png) [@senocular](https://forum.kirupa.com/u/senocular)\
**Post date:** [March 6, 2019, 9:27pm UTC](https://forum.kirupa.com/t/how-to-implement-redux-devtools/639474/5 "2019-03-06T21:27:13Z")

</div>

> [@kayut](#):
>
> \<Provider store={store(rootReducer)}\>

For the provider, you just provide the store as a value, not call it as a function - since its not, as the error “ **TypeError: store is not a function** ” indicates. `rootReducer` was already given to the store when you created it. All you need is.

```auto
<Provider store={store}>

```