change state management from mobx to redux

.eslintrc

@@ -1,3 +1,6 @@
 {
-  "extends": "react-app"
+  "extends": "react-app",
+  "rules": {
+    "require-yield": "off"
+  }
 }

package.json

@@ -42,6 +42,7 @@
     "redux-actions": "^2.2.1",
     "redux-logger": "^3.0.6",
     "redux-promise-middleware": "^5.0.0",
+    "redux-saga": "^0.16.0",
     "redux-thunk": "^2.2.0",
     "semantic-ui-css": "^2.2.14",
     "semantic-ui-react": "^0.78.2",

src/client/Root.js

@@ -2,14 +2,14 @@ import * as React from 'react';
 import { BrowserRouter } from 'react-router-dom';
 import App from '../App';
 
-// // redux
-// import { Provider  } from 'react-redux';
-// import store from '../redux/store';
+// redux
+import { Provider  } from 'react-redux';
+import store from '../redux/store';
 
 // mobx
-import { Provider } from 'mobx-react';
-import Store from '../mobx/Store';
-const store = new Store();
+// import { Provider } from 'mobx-react';
+// import Store from '../mobx/Store';
+// const store = new Store();
 
 const Root = () => (
   <BrowserRouter>

src/components/menus/TopMenu.js

@@ -7,8 +7,8 @@ const TopMenu = () => {
       <div className="ui three item menu">
         <NavLink exact={true} to="/" className="item" activeClassName="active">Home</NavLink>
         <NavLink to="/about" className="item" activeClassName="active">About</NavLink>
-        <NavLink to="/mobxExample" className="item" activeClassName="active">mobx example</NavLink>
-        {/* <NavLink to="/reduxExample" className="item" activeClassName="active">redux example</NavLink> */}
+        {/* <NavLink to="/mobxExample" className="item" activeClassName="active">mobx example</NavLink> */}
+        <NavLink to="/reduxExample" className="item" activeClassName="active">redux example</NavLink>
       </div>
     </div>
   );

src/components/pages/ReduxExample.js

@@ -1,8 +1,8 @@
 import * as React from 'react';
 import { connect } from 'react-redux';
 import { bindActionCreators } from 'redux';
-import * as counterActions from '../../redux/modules/counter';
-import * as postActions from '../../redux/modules/post';
+import * as counterActions from '../../redux/reducers/counter';
+import * as postActions from '../../redux/reducers/post';
 
 class ReduxExample extends React.Component {
   componentWillMount() {

src/redux/store.js

@@ -1,5 +1,5 @@
 import { createStore, applyMiddleware } from 'redux';
-import modules from './modules';
+import reducers from './reducers';
 import { createLogger } from 'redux-logger';
 import ReduxThunk from 'redux-thunk';
 import promiseMiddleware from 'redux-promise-middleware';
@@ -10,7 +10,7 @@ const customizedPromiseMiddleware = promiseMiddleware({
 });
 
 const store = createStore(
-  modules,
+  reducers,
   applyMiddleware(logger, ReduxThunk, customizedPromiseMiddleware)
 );
 

src/server/render.js

@@ -5,16 +5,16 @@ import App from '../App';
 import { Helmet } from 'react-helmet';
 
 // // redux
-// import { Provider } from 'react-redux';
-// import store from '../redux/store';
+import { Provider } from 'react-redux';
+import store from '../redux/store';
 
-// mobx
-import { toJS } from 'mobx';
-import { Provider } from 'mobx-react';
-import Store from '../mobx/Store';
+// // mobx
+// import { toJS } from 'mobx';
+// import { Provider } from 'mobx-react';
+// import Store from '../mobx/Store';
 
 const render = async (location) => {
-  const store = new Store();  //mobx
+  // const store = new Store();  //mobx
   const helmet = Helmet.renderStatic();
   const context = {};
 
@@ -28,8 +28,8 @@ const render = async (location) => {
 
   return {
     html,
-    // state: store.getState(),  // redux
-    state: toJS(store),    // mobx
+    state: store.getState(),  // redux
+    // state: toJS(store),    // mobx
     helmet,
   };
 };