diff --git a/.babelrc b/.babelrc
new file mode 100644
index 00000000..e1d3c5df
--- /dev/null
+++ b/.babelrc
@@ -0,0 +1,4 @@
+{
+ "presets": ["es2015", "react"],
+ "plugins": ["transform-object-assign"]
+}
diff --git a/.eslintignore b/.eslintignore
new file mode 100644
index 00000000..1521c8b7
--- /dev/null
+++ b/.eslintignore
@@ -0,0 +1 @@
+dist
diff --git a/.eslintrc.js b/.eslintrc.js
index ebf8b95b..ed360b75 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -32,6 +32,13 @@ module.exports = {
"semi": [
"error",
"never"
- ]
+ ],
+ "jsx-quotes": [
+ "error",
+ "prefer-double"
+ ],
+ "react/jsx-uses-vars": "error",
+ "react/jsx-uses-react": "error",
+ "react/jsx-no-bind": "error"
}
};
diff --git a/app/DevTools.jsx b/app/DevTools.jsx
new file mode 100644
index 00000000..506a87a3
--- /dev/null
+++ b/app/DevTools.jsx
@@ -0,0 +1,16 @@
+import React from "react"
+
+import { createDevTools } from "redux-devtools"
+
+import LogMonitor from "redux-devtools-log-monitor"
+import DockMonitor from "redux-devtools-dock-monitor"
+
+const DevTools = createDevTools(
+
+
+
+)
+
+export default DevTools
diff --git a/app/actions/index.js b/app/actions/index.js
new file mode 100644
index 00000000..bdab72a1
--- /dev/null
+++ b/app/actions/index.js
@@ -0,0 +1,8 @@
+import {SELECT_ITEM} from "../constants/actionTypes"
+
+export const selectItem = (id) => {
+ return {
+ type: SELECT_ITEM,
+ id: id
+ }
+}
diff --git a/app/components/Item.jsx b/app/components/Item.jsx
new file mode 100644
index 00000000..ea07c98c
--- /dev/null
+++ b/app/components/Item.jsx
@@ -0,0 +1,25 @@
+import React, { PropTypes } from "react"
+import {ListItem} from "react-photonkit"
+
+const Item = ({
+ text,
+ active,
+ handleClick
+}) => (
+
+
+
+)
+
+Item.propTypes = {
+ text: PropTypes.string.isRequired,
+ active: PropTypes.bool.isRequired,
+ handleClick: PropTypes.func.isRequired
+}
+
+export default Item
diff --git a/app/components/ItemList.jsx b/app/components/ItemList.jsx
new file mode 100644
index 00000000..d50880c8
--- /dev/null
+++ b/app/components/ItemList.jsx
@@ -0,0 +1,30 @@
+import React, { PropTypes } from "react"
+import { Pane, ListGroup } from "react-photonkit"
+import Item from "./Item"
+
+const ItemList = ({
+ items,
+ handleItemClick
+}) => (
+
+
+ {items.map((todo) => {
+ return (
+
+ )
+ })}
+
+
+)
+
+ItemList.propTypes = {
+ items: PropTypes.array.isRequired,
+ handleItemClick: PropTypes.func.isRequired
+}
+
+export default ItemList
diff --git a/app/constants/actionTypes.js b/app/constants/actionTypes.js
new file mode 100644
index 00000000..c2459e04
--- /dev/null
+++ b/app/constants/actionTypes.js
@@ -0,0 +1 @@
+export const SELECT_ITEM = "SELECT_ITEM"
diff --git a/app/containers/SelectableItemList.jsx b/app/containers/SelectableItemList.jsx
new file mode 100644
index 00000000..a1fb677b
--- /dev/null
+++ b/app/containers/SelectableItemList.jsx
@@ -0,0 +1,19 @@
+import { connect } from "react-redux"
+import { selectItem } from "../actions"
+import ItemList from "../components/ItemList"
+
+const mapStateToProps = (state) => {
+ return {
+ items: state.items
+ }
+}
+
+const mapDispatchToProps = (dispatch) => {
+ return {
+ handleItemClick: (id) => {
+ dispatch(selectItem(id))
+ }
+ }
+}
+
+export default connect(mapStateToProps, mapDispatchToProps)(ItemList)
diff --git a/app/index.html b/app/index.html
index 26988b20..7f1c0fbe 100644
--- a/app/index.html
+++ b/app/index.html
@@ -5,15 +5,13 @@
Classroom Desktop 0.0.1
- Hello World! 0.0.1
-
- We are using node ,
- Chromium ,
- and Electron .
+