This guide describes an application architecture for web client development with Angular.
The main challenge we encounter in our projects is to bring junior developers into client development. There are a lot of different frameworks and architectures in the market. The idea is to define an architecture which is a compromise between, on the one hand, leveraging the best practices and latest trends like reactive style development, on the other hand, providing a short onboarding time while still using an architecture that helps us scale and be productive at the same time. Also, the architecture must be compatible with the market. Guides, practices and naming found in the web should still be valid (e.g. a stackoverflow article for a given problem)
What we decided to go for is an architecture that leverages the benefits of reactive frontend architecture while remaining free of a dependency to a concrete framework like ngrx or angular-redux. The main driver is, to make it easy to adapt the architecture and get going very fast. So, it is not necessary to learn about reducers, actions and middleware (e.g. action-creators, thunks, effects, etc.) and still have the benefits of reactive style programming.
That being said, we provide a tutorial for using NgRx as a state management framework.