rocksinghajay

npm install redux react-redux react-router-dom react-router-redux@next redux-thunk history redux-devtools-extension

rocksinghajay

import { createStore, applyMiddleware } from 'redux'
import thunk from 'redux-thunk'
import { routerMiddleware } from 'react-router-redux'
import createHistory from 'history/createBrowserHistory'
import rootReducer from '../reducers'

export const history = createHistory()

const middleware = [thunk, routerMiddleware(history)]

rocksinghajay

import React from 'react';
import { Route, Link } from 'react-router-dom'
import Home from '../home'
import About from '../about'
import Todo from '../todo'
class App extends React.Component {
  render() {
    return (
      <div>
        <header>

rocksinghajay

import React from 'react'
class Home extends React.Component {
  render() {
    return (
		<div>
			<h1>Home</h1>
			It is a long established fact that a reader will be distracted by the readable content of a
			 page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-
			 less normal distribution of letters, as opposed to using 'Content here, content here', 
			 making it look like readable English. Many desktop publishing packages and web page editors 

rocksinghajay

import React from 'react'
class About extends React.Component {
  render() {
    return (
	  <div>
	    <h1>About Us</h1>
	    <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has 
	    been the industry standard dummy text ever since the 1500s, when an unknown printer took a 
	    galley of type and scrambled it to make a type specimen book. It has survived not only five 
	    centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It 

rocksinghajay

import React from 'react';
import {connect} from 'react-redux';
import {addtodoAction} from '../../actions/addtodoAction';
class Todo extends React.Component {
	constructor(props) {
    super(props);
    this.state = {
 		text:''
 	};
 }

rocksinghajay

export const ADD_USER = 'ADD_USER';

rocksinghajay

import * as types from '../types.js';
import store from '../../store';
let {getState} = store;
export const addtodoAction = (text) => {
	let userList = getState().addtodoReducer.todos;
	userList.push(text)
	 return dispatch => {
	 	dispatch({
	 		type: types.ADD_USER,
	 		payload: userList

rocksinghajay

import * as types from '../../actions/types.js';
const initState ={
	todos:[],
}
export function addtodoReducer(state = initState, action) {
	switch(action.type) {
		case types.ADD_USER:
		return Object.assign({}, state, { todos: action.payload});
		break;
		default:

rocksinghajay

import { combineReducers } from 'redux';
import { routerReducer } from 'react-router-redux';
import {addtodoReducer} from './addtodoReducer';
export default combineReducers({
router: routerReducer,
addtodoReducer:addtodoReducer

});