Redux ~ Flow - rohit120582sharma/Documentation GitHub Wiki

Now that the application is set up, the user can start interacting with it. Let’s trigger an action to see the data flow.

  • The view layer dispatches an action using action creator. The action is either dispatched automatically (if bindActionCreators() was used in setup), or the view dispatches the action.

  • The store receives the action. It sends the current state tree and the action to the root reducer.

  • The root reducer cuts apart the state tree into slices. Then it passes each slice to the sub-reducer that knows how to deal with it.

  • The sub-reducer copies the slice and makes changes to the copy. It returns the copy of the slice to the root reducer.

  • Once all of the sub-reducers have returned their slice copies, the root reducer pastes all of them together to form the whole updated state tree, which it returns to the store. The store replaces the old state tree with the new one.

  • The store tells the view layer binding that there’s new state.

  • The view layer binding asks the store to send over the new state and triggers a re-render.