diff --git a/6-mobx-react/.babelrc b/6-mobx-react/.babelrc
new file mode 100644
index 00000000..1957865a
--- /dev/null
+++ b/6-mobx-react/.babelrc
@@ -0,0 +1,4 @@
+{
+ "presets": ['react', 'es2015'],
+ "plugins": ['transform-decorators-legacy', 'transform-class-properties']
+}
diff --git a/6-mobx-react/.gitignore b/6-mobx-react/.gitignore
new file mode 100644
index 00000000..fd4f2b06
--- /dev/null
+++ b/6-mobx-react/.gitignore
@@ -0,0 +1,2 @@
+node_modules
+.DS_Store
diff --git a/6-mobx-react/.nvmrc b/6-mobx-react/.nvmrc
new file mode 100644
index 00000000..dffc266d
--- /dev/null
+++ b/6-mobx-react/.nvmrc
@@ -0,0 +1 @@
+v6.3.0
diff --git a/6-mobx-react/package.json b/6-mobx-react/package.json
new file mode 100644
index 00000000..7d60c0a2
--- /dev/null
+++ b/6-mobx-react/package.json
@@ -0,0 +1,28 @@
+{
+ "name": "react-mobx-todos",
+ "version": "1.0.0",
+ "description": "",
+ "main": "index.js",
+ "scripts": {
+ "start": "webpack-dev-server --content-base src --inline --hot"
+ },
+ "keywords": [],
+ "author": "",
+ "license": "ISC",
+ "dependencies": {
+ "react": "^15.2.1",
+ "react-dom": "^15.3.0"
+ },
+ "devDependencies": {
+ "babel-loader": "^6.2.4",
+ "babel-plugin-transform-class-properties": "^6.10.2",
+ "babel-plugin-transform-decorators-legacy": "^1.3.4",
+ "babel-preset-es2015": "^6.9.0",
+ "babel-preset-react": "^6.11.1",
+ "css-loader": "^0.23.1",
+ "react-addons-test-utils": "^15.3.0",
+ "style-loader": "^0.13.1",
+ "webpack": "^1.13.1",
+ "webpack-dev-server": "^1.14.1"
+ }
+}
diff --git a/6-mobx-react/src/css/main.css b/6-mobx-react/src/css/main.css
new file mode 100644
index 00000000..8d6ed00c
--- /dev/null
+++ b/6-mobx-react/src/css/main.css
@@ -0,0 +1,50 @@
+html,
+body {
+ margin: 0;
+ padding: 0;
+}
+
+body {
+ font-family: 'Slabo 27px', serif;
+ background: #f5f5f5;
+ color: #4d4d4d;
+ min-width: 230px;
+ max-width: 550px;
+ margin: 0 auto;
+ -webkit-font-smoothing: antialiased;
+ -moz-font-smoothing: antialiased;
+ font-smoothing: antialiased;
+ font-weight: 300;
+}
+
+input {
+ border-radius: 5px;
+ padding: 5px;
+ border: 1px solid rgba(0,0,0,0.3);
+ margin-right: 10px
+}
+
+input::-webkit-input-placeholder {
+ font-style: italic;
+ font-weight: 300;
+ color: rgba(0,0,0,0.3);
+}
+
+input::-moz-placeholder {
+ font-style: italic;
+ font-weight: 300;
+ color: rgba(0,0,0,0.3);
+}
+
+input::input-placeholder {
+ font-style: italic;
+ font-weight: 300;
+ color: rgba(0,0,0,0.3);
+}
+
+h1 {
+ font-weight: 100;
+ font-size: 100px;
+ padding:0;
+ margin: 0;
+}
diff --git a/6-mobx-react/src/index.html b/6-mobx-react/src/index.html
new file mode 100644
index 00000000..a9e74ecd
--- /dev/null
+++ b/6-mobx-react/src/index.html
@@ -0,0 +1,9 @@
+
+
+
+
+
+
+
+
+
diff --git a/6-mobx-react/src/js/TodoList.js b/6-mobx-react/src/js/TodoList.js
new file mode 100644
index 00000000..62201267
--- /dev/null
+++ b/6-mobx-react/src/js/TodoList.js
@@ -0,0 +1,8 @@
+import React from "react"
+
+
+export default class TodoList extends React.Component {
+ render() {
+ return MobX
+ }
+}
diff --git a/6-mobx-react/src/js/TodoStore.js b/6-mobx-react/src/js/TodoStore.js
new file mode 100644
index 00000000..e69de29b
diff --git a/6-mobx-react/src/js/main.js b/6-mobx-react/src/js/main.js
new file mode 100644
index 00000000..f5262b34
--- /dev/null
+++ b/6-mobx-react/src/js/main.js
@@ -0,0 +1,10 @@
+import "../css/main.css"
+import React from "react"
+import ReactDOM from "react-dom"
+
+import TodoList from "./TodoList"
+
+const app = document.getElementById("app")
+
+ReactDOM.render(, app)
+
diff --git a/6-mobx-react/webpack.config.js b/6-mobx-react/webpack.config.js
new file mode 100644
index 00000000..7c467bef
--- /dev/null
+++ b/6-mobx-react/webpack.config.js
@@ -0,0 +1,28 @@
+var debug = process.env.NODE_ENV !== "production";
+var webpack = require('webpack');
+var path = require('path');
+
+module.exports = {
+ context: path.join(__dirname, "src"),
+ devtool: debug ? "inline-sourcemap" : null,
+ entry: "./js/main.js",
+ module: {
+ loaders: [
+ {
+ test: /\.js$/,
+ exclude: /(node_modules|bower_components)/,
+ loader: 'babel-loader',
+ },
+ { test: /\.css$/, loader: "style-loader!css-loader" },
+ ]
+ },
+ output: {
+ path: path.join(__dirname, "src"),
+ filename: "main.min.js"
+ },
+ plugins: debug ? [] : [
+ new webpack.optimize.DedupePlugin(),
+ new webpack.optimize.OccurenceOrderPlugin(),
+ new webpack.optimize.UglifyJsPlugin({ mangle: false, sourcemap: false }),
+ ],
+};