This article explains how to create a simple React Todo example using Redux.

  • Install create-react-app

https://github.com/facebookincubator/create-react-app

npm install -g create-react-app
  • Create todo app using create-react-app command line.
create-react-app todo-react-redux
  • Create the component, container, reducer, action folders.
cd todo-react-redux
mkdir components containers actions reducers
  • Install required Redux and dependency packages
 npm install --save redux
 npm install --save react-redux
  • Create the components Todo.js, TodoList.js, Footer.js, Link.js (https://github.com/harikrish/todo-react-redux/tree/master/src/components)

  • Create the container components AddTodo.js, FilterLink.js, VisibleTodoList.js (https://github.com/harikrish/todo-react-redux/tree/master/src/containers)

  • Create the reducers todos.js, visibilityFilter.js (https://github.com/harikrish/todo-react-redux/tree/master/src/reducers)

  • Create the actions (https://github.com/harikrish/todo-react-redux/tree/master/src/actions)

  • Update App.js, index.js (https://github.com/harikrish/todo-react-redux/tree/master/src)

  • Run the server

npm start