part 06

Author: rwieruch

package-lock.json

@@ -26,6 +26,7 @@
     "fs-extra": "3.0.1",
     "html-webpack-plugin": "2.29.0",
     "jest": "20.0.4",
+    "mobx": "^3.2.2",
     "object-assign": "4.1.1",
     "postcss-flexbugs-fixes": "3.2.0",
     "postcss-loader": "2.0.6",

package.json

@@ -2,28 +2,11 @@ import React from 'react';
 import ReactDOM from 'react-dom';
 import './index.css';
 import App from './components/App';
+import storyStore from './stores/storyStore';
 import registerServiceWorker from './registerServiceWorker';
 
-const stories = [
-  {
-    title: 'React',
-    url: 'https://facebook.github.io/react/',
-    author: 'Jordan Walke',
-    num_comments: 3,
-    points: 4,
-    objectID: 0,
-  }, {
-    title: 'Redux',
-    url: 'https://github.com/reactjs/redux',
-    author: 'Dan Abramov, Andrew Clark',
-    num_comments: 2,
-    points: 5,
-    objectID: 1,
-  },
-];
-
 ReactDOM.render(
-  <App stories={stories} onArchive={(objectID) => { console.log(objectID); }} />,
+  <App stories={storyStore.stories} onArchive={(objectID) => { console.log(objectID); }} />,
   document.getElementById('root')
 );
 registerServiceWorker();

src/index.js

@@ -0,0 +1,27 @@
+import { observable } from 'mobx';
+
+const INITIAL_STATE = [
+  {
+    title: 'React',
+    url: 'https://facebook.github.io/react/',
+    author: 'Jordan Walke',
+    num_comments: 3,
+    points: 4,
+    objectID: 0,
+  }, {
+    title: 'Redux',
+    url: 'https://github.com/reactjs/redux',
+    author: 'Dan Abramov, Andrew Clark',
+    num_comments: 2,
+    points: 5,
+    objectID: 1,
+  },
+];
+
+class StoryStore {
+  @observable stories = INITIAL_STATE;
+}
+
+const storyStore = new StoryStore();
+
+export default storyStore;