updated dependencies, use ES6 syntax

mweststrate · mweststrate · commit 64f47f17a2cb · 2015-10-29T13:39:17.000+01:00
diff --git a/index.html b/index.html
@@ -3,7 +3,7 @@
     <title>Todo App</title>
   </head>
   <body>
-    <pre id="approot"></pre>
+    <div id="root"></div>
     <script src="/static/bundle.js"></script>
   </body>
 </html>
diff --git a/package.json b/package.json
@@ -28,14 +28,14 @@
     "babel-eslint": "^3.1.9",
     "babel-loader": "^5.1.2",
     "eslint-plugin-react": "^2.3.0",
-    "mobservable-react-devtools": "^1.0.0",
+    "mobservable-react-devtools": "^2.0.1",
     "react-hot-loader": "^1.2.7",
     "webpack": "^1.9.6",
     "webpack-dev-server": "^1.8.2"
   },
   "dependencies": {
     "mobservable": "^1.0.0",
-    "mobservable-react": "^1.0.0",
+    "mobservable-react": "^2.0.0",
     "react": "^0.14.0",
     "react-dom": "^0.14.0"
   }
diff --git a/src/index.js b/src/index.js
@@ -1,32 +1,36 @@
-import React from 'react';
+import React, {Component} from 'react';
+import ReactDOM from 'react-dom';
 import {observable} from 'mobservable';
 import {observer} from 'mobservable-react';
 
 // uncomment next line to enable the dev-tools.
-// import 'mobservable-react-devtools';
+import 'mobservable-react-devtools';
 
-var appState = observable({
+const appState = observable({
     timer: 0
 });
 
 appState.resetTimer = function() {
     appState.timer = 0;
 };
 
-setInterval(function() {
+setInterval(() => {
     appState.timer += 1;
 }, 1000);
-        
-var TimerView = observer(React.createClass({
-     render: function() {
-        return (<button onClick={this.onReset}>
-        	Seconds passed: {this.props.appState.timer}
-            </button>);
-     },
-     
-     onReset: function() {
+
+@observer
+class TimerView extends Component {
+     render() {
+        return (
+            <button onClick={this.onReset}>
+                Seconds passed: {this.props.appState.timer}
+            </button>
+        );
+     }
+
+     onReset = () => {
      	this.props.appState.resetTimer();
      }
-}));
+};
 
-React.render(<TimerView appState={appState} />, document.body);
+ReactDOM.render(<TimerView appState={appState} />, document.getElementById('root'));
