Image for postIn front-end programming often happens that user-interaction with one component should update other components. Eventually this leads to twisted architecture, because links between components are difficult to maintain when introducing a new component or removing one.

The solution is to introduce a specific central component that doesn’t do any visual rendering, but instead holds data referenced during a rendering by the rest of the components. The holding data central-component is called model-component. Visual components that render data from a model are called view-component. Input components that receive input-data from a user are named controller components.

Controller components directly updates the model. Model interacts with the views through intermediate event-objects describing what change has been made to the model.

#typescript #programming

Advanced State Management with the Observer Pattern and TypeScript
2.15 GEEK