What design patterns do you apply when developing the frontend?

When developing the frontend, the following design patterns are often used:

• MVC (Model-View-Controller): separation of data, logic, and presentation to simplify maintenance and extension.
• MVVM (Model-View-ViewModel): especially popular with frameworks like Angular or WPF, where the ViewModel connects the model and the view.
• Observer: for reactive UI updates when data changes.
• Singleton: for managing global states or services.
• Factory: for creating components or objects with different configurations.

Example of using the Observer pattern in JavaScript:

class Observable {
  constructor() {
    this.observers = [];
  }
  subscribe(fn) {
    this.observers.push(fn);
  }
  notify(data) {
    this.observers.forEach(fn => fn(data));
  }
}

const observable = new Observable();
observable.subscribe(data => console.log('Observer 1:', data));
observable.notify('Data update');

The choice of patterns depends on the project requirements and the technologies used.