diff --git a/examples/counter/package.json b/examples/counter/package.json
index 78ff31ba..3c7d14a0 100644
--- a/examples/counter/package.json
+++ b/examples/counter/package.json
@@ -29,7 +29,7 @@
"react-hot-loader": "^1.3.0",
"redux-devtools": "^3.0.0-beta-2",
"redux-devtools-log-monitor": "^1.0.0-beta-2",
- "redux-devtools-dock-monitor": "^1.0.0-beta-1",
+ "redux-devtools-dock-monitor": "^1.0.0-beta-2",
"webpack": "^1.9.11",
"webpack-dev-server": "^1.9.0"
}
diff --git a/examples/counter/src/store/configureStore.js b/examples/counter/src/store/configureStore.js
index 4a4437c2..78c9ea1f 100644
--- a/examples/counter/src/store/configureStore.js
+++ b/examples/counter/src/store/configureStore.js
@@ -1,4 +1,4 @@
-if (process.env.NODE_ENV === 'development') {
+if (process.env.NODE_ENV === 'production') {
module.exports = require('./configureStore.prod');
} else {
module.exports = require('./configureStore.dev');
diff --git a/examples/todomvc/README.md b/examples/todomvc/README.md
index da2a8208..0f00054e 100644
--- a/examples/todomvc/README.md
+++ b/examples/todomvc/README.md
@@ -1,6 +1,14 @@
# Redux DevTools TodoMVC example
-## Getting Started
+## Running example
-1. Install dependencies: `npm i`
-2. Start the development server: `npm start`
+```
+git clone https://github.com/gaearon/redux-devtools.git
+cd redux-devtools
+npm install
+
+cd examples/todomvc
+npm install
+npm start
+open http://localhost:3000
+```
diff --git a/examples/todomvc/containers/App.js b/examples/todomvc/containers/App.js
deleted file mode 100644
index f2166ea7..00000000
--- a/examples/todomvc/containers/App.js
+++ /dev/null
@@ -1,38 +0,0 @@
-import React, { Component } from 'react';
-import TodoApp from './TodoApp';
-import { createStore, combineReducers, compose } from 'redux';
-import { devTools, persistState } from 'redux-devtools';
-import { DevTools, DebugPanel, LogMonitor } from 'redux-devtools/lib/react';
-import { Provider } from 'react-redux';
-import * as reducers from '../reducers';
-
-const finalCreateStore = compose(
- devTools(),
- persistState(window.location.href.match(/[?&]debug_session=([^&]+)\b/))
-)(createStore);
-
-const reducer = combineReducers(reducers);
-const store = finalCreateStore(reducer);
-
-if (module.hot) {
- module.hot.accept('../reducers', () =>
- store.replaceReducer(combineReducers(require('../reducers')))
- );
-}
-
-export default class App extends Component {
- render() {
- return (
-
- );
- }
-}
diff --git a/examples/todomvc/containers/DevTools.js b/examples/todomvc/containers/DevTools.js
new file mode 100644
index 00000000..70fd5bf4
--- /dev/null
+++ b/examples/todomvc/containers/DevTools.js
@@ -0,0 +1,11 @@
+import React from 'react';
+import { createDevTools } from 'redux-devtools';
+import LogMonitor from 'redux-devtools-log-monitor';
+import DockMonitor from 'redux-devtools-dock-monitor';
+
+export default createDevTools(
+
+
+
+);
diff --git a/examples/todomvc/containers/Root.dev.js b/examples/todomvc/containers/Root.dev.js
new file mode 100644
index 00000000..43f6626e
--- /dev/null
+++ b/examples/todomvc/containers/Root.dev.js
@@ -0,0 +1,18 @@
+import React, { Component } from 'react';
+import { Provider } from 'react-redux';
+import TodoApp from './TodoApp';
+import DevTools from './DevTools';
+
+export default class Root extends Component {
+ render() {
+ const { store } = this.props;
+ return (
+
+
+
+
+
+
+ );
+ }
+}
diff --git a/examples/todomvc/containers/Root.js b/examples/todomvc/containers/Root.js
new file mode 100644
index 00000000..9cea0b22
--- /dev/null
+++ b/examples/todomvc/containers/Root.js
@@ -0,0 +1,5 @@
+if (process.env.NODE_ENV === 'production') {
+ module.exports = require('./Root.prod');
+} else {
+ module.exports = require('./Root.dev');
+}
diff --git a/examples/todomvc/containers/Root.prod.js b/examples/todomvc/containers/Root.prod.js
new file mode 100644
index 00000000..7a29a4fe
--- /dev/null
+++ b/examples/todomvc/containers/Root.prod.js
@@ -0,0 +1,14 @@
+import React, { Component } from 'react';
+import { Provider } from 'react-redux';
+import TodoApp from './TodoApp';
+
+export default class Root extends Component {
+ render() {
+ const { store } = this.props;
+ return (
+
+
+
+ );
+ }
+}
diff --git a/examples/todomvc/index.js b/examples/todomvc/index.js
index 3da96f62..9ed89148 100644
--- a/examples/todomvc/index.js
+++ b/examples/todomvc/index.js
@@ -1,8 +1,12 @@
-import React from 'react';
-import App from './containers/App';
import 'todomvc-app-css/index.css';
+import React from 'react';
+import { render } from 'react-dom';
+import configureStore from './store/configureStore';
+import Root from './containers/Root';
-React.render(
- ,
+const store = configureStore();
+
+render(
+ ,
document.getElementById('root')
);
diff --git a/examples/todomvc/package.json b/examples/todomvc/package.json
index 0edba6b0..991a452b 100644
--- a/examples/todomvc/package.json
+++ b/examples/todomvc/package.json
@@ -29,8 +29,9 @@
"homepage": "https://github.com/gaearon/redux-devtools#readme",
"dependencies": {
"classnames": "^2.1.2",
- "react": "^0.13.3",
- "react-redux": "^3.0.0",
+ "react": "^0.14.0",
+ "react-dom": "^0.14.0",
+ "react-redux": "^4.0.0",
"redux": "^3.0.0"
},
"devDependencies": {
@@ -39,6 +40,9 @@
"node-libs-browser": "^0.5.2",
"raw-loader": "^0.5.1",
"react-hot-loader": "^1.3.0",
+ "redux-devtools": "^3.0.0-beta-2",
+ "redux-devtools-log-monitor": "^1.0.0-beta-2",
+ "redux-devtools-dock-monitor": "^1.0.0-beta-2",
"style-loader": "^0.12.3",
"todomvc-app-css": "^2.0.1",
"webpack": "^1.9.11",
diff --git a/examples/todomvc/reducers/index.js b/examples/todomvc/reducers/index.js
index b340db27..f4aad188 100644
--- a/examples/todomvc/reducers/index.js
+++ b/examples/todomvc/reducers/index.js
@@ -1 +1,8 @@
-export { default as todos } from './todos';
+import { combineReducers } from 'redux';
+import todos from './todos';
+
+const rootReducer = combineReducers({
+ todos
+});
+
+export default rootReducer;
diff --git a/examples/todomvc/store/configureStore.dev.js b/examples/todomvc/store/configureStore.dev.js
new file mode 100644
index 00000000..af1540ce
--- /dev/null
+++ b/examples/todomvc/store/configureStore.dev.js
@@ -0,0 +1,25 @@
+import { createStore, compose } from 'redux';
+import { persistState } from 'redux-devtools';
+import rootReducer from '../reducers';
+import DevTools from '../containers/DevTools';
+
+const finalCreateStore = compose(
+ DevTools.instrument(),
+ persistState(
+ window.location.href.match(
+ /[?&]debug_session=([^&]+)\b/
+ )
+ )
+)(createStore);
+
+export default function configureStore(initialState) {
+ const store = finalCreateStore(rootReducer, initialState);
+
+ if (module.hot) {
+ module.hot.accept('../reducers', () =>
+ store.replaceReducer(require('../reducers'))
+ );
+ }
+
+ return store;
+}
diff --git a/examples/todomvc/store/configureStore.js b/examples/todomvc/store/configureStore.js
new file mode 100644
index 00000000..78c9ea1f
--- /dev/null
+++ b/examples/todomvc/store/configureStore.js
@@ -0,0 +1,5 @@
+if (process.env.NODE_ENV === 'production') {
+ module.exports = require('./configureStore.prod');
+} else {
+ module.exports = require('./configureStore.dev');
+}
diff --git a/examples/todomvc/store/configureStore.prod.js b/examples/todomvc/store/configureStore.prod.js
new file mode 100644
index 00000000..2872f85a
--- /dev/null
+++ b/examples/todomvc/store/configureStore.prod.js
@@ -0,0 +1,6 @@
+import { createStore } from 'redux';
+import rootReducer from '../reducers';
+
+export default function configureStore(initialState) {
+ return createStore(rootReducer, initialState);
+}