Architecting Angular Applications with Redux, RxJS, and NgRx

A uniform data flow

Let's introduce all parties involved in our uniform data flow by starting from the very top and slowly work our way down, concept by concept. We will build an application consisting of two views. In the first view, the user will select an item from a list. This should result in an action being created. This action will then be dispatched, by the dispatcher. The action and its payload will end up in a store. The other view meanwhile listens to changes from the store. When an item is selected, the second view will be made aware and can therefore indicate in its UI that a specific item has been selected. On a high level, our application and its flow will look like the following: