diff --git a/js/components/commentsList.js b/js/components/commentsList.js
index ab61cbf..2be36d6 100644
--- a/js/components/commentsList.js
+++ b/js/components/commentsList.js
@@ -1,4 +1,5 @@
import React from 'react';
+import { connect } from 'react-redux';
class CommentsList extends React.Component {
render() {
@@ -10,4 +11,14 @@ class CommentsList extends React.Component {
}
}
-export default CommentsList;
+const mapStateToProps = function(state){
+ return {
+ comments: state
+ }
+}
+
+const VisibleCommentsList = connect(
+ mapStateToProps
+)(CommentsList);
+
+export default VisibleCommentsList;
diff --git a/js/index.js b/js/index.js
index 5b7d434..738fbdb 100644
--- a/js/index.js
+++ b/js/index.js
@@ -1,8 +1,16 @@
import ReactDOM from 'react-dom';
import React from 'react';
import App from './components/app.js';
+import { Provider } from 'react-redux'
+import store from './store.js'
+
+store.dispatch({type:'ADD', comment: { body: "fun" }});
+store.dispatch({type:'ADD', comment: { body: "for" }});
+store.dispatch({type:'ADD', comment: { body: "matt" }});
ReactDOM.render(
- ,
- document.querySelector('main')
+
+
+ ,
+ document.querySelector('main')
);
diff --git a/js/store.js b/js/store.js
new file mode 100644
index 0000000..747588c
--- /dev/null
+++ b/js/store.js
@@ -0,0 +1,14 @@
+import { createStore } from 'redux'
+
+let comments = function(state = [], action){
+ switch(action.type){
+ case 'ADD':
+ return [...state, action.comment];
+ default:
+ return state
+ }
+}
+
+let store = createStore(comments);
+
+export default store;
diff --git a/package.json b/package.json
index c159984..03418c3 100644
--- a/package.json
+++ b/package.json
@@ -1,5 +1,5 @@
{
- "name": "react-redux",
+ "name": "react-redux-test",
"version": "1.0.0",
"description": "",
"main": "index.js",
@@ -23,6 +23,8 @@
"babel-preset-react": "^6.24.1",
"react": "^15.5.4",
"react-dom": "^15.5.4",
+ "react-redux": "^5.0.4",
+ "redux": "^3.6.0",
"webpack": "^2.4.1",
"webpack-dev-server": "^2.4.5"
}