Premium Courses

Learn practical web development building multi user SEO blog app in Laravel. A Journey from localhost to live server.

Learn the fastest growing and high in demand React Js in short period of time along with ES6. Build a Newsapp while learning.

A complete beginners guide to Web Development. Master the art of building Responsive web pages with this course. Learn to code from scratch!

Redux Workflow - Guide for absolute beginners to redux

Redux Workflow - Guide for absolute beginners to redux

Category: Redux   Updated by Ryan Dhungel

This article is not much of a Redux tutorial. Please visit Official Redux site for proper walkthrough and explanation. This articles shows the code that is presented in a step by step manner. It is easy to follow for beginners. You can create a simple js file and run this code for learning purpose or use something like jsbin.

// initial state
const initialState = {
  todos: [
        text: 'Eat food'
        text: 'Exercise'

// create a simple action types 

// create some action creators
function addTodo(text) {
    return {
        type: ADD_TODO,
        text: text

// create some reducers
function postsReducer(state = [], action) {
    switch(action.type) {
        case ADD_TODO:
            return [...state.todos, {text: action.text}]
            return state

console.log('initial state', initialState)

// make changes to initial state
const action = addTodo('make it work')
const newState = postsReducer(initialState, action)
// RESULT: initial state {todos: Array(2)}

// new state after changes
console.log('New State: ', newState)
// RESULT: New State:  (3) [{…}, {…}, {…}]‚Äč

Back to articles