Čo je to architektonický vzor MVVM?

MVVM (Model-View-ViewModel) je architektonický vzor, ktorý oddelí používateľské rozhranie (View) od podnikovej logiky (Model) prostredníctvom medzičlánku — ViewModel.

Zložka	Popis	Účel
Model	Predstavuje údaje a podnikové pravidlá.	Poskytuje údaje, nezávisle od View a ViewModel.
View	Zobrazuje používateľské rozhranie.	Zodpovedá za vizualizáciu a interakciu s používateľom.
ViewModel	Obsahuje logiku prezentácie, prenáša údaje z Modelu do View.	Spája View a Model, obsahuje príkazy a vlastnosti pre View.

V MVVM je spojenie medzi View a ViewModel zabezpečené prostredníctvom mechanizmov viazania dát (data binding). View "sa prihlási" na zmeny vlastností vo ViewModel a ViewModel upozorňuje View na tieto zmeny. Interakcia používateľa s View (napríklad kliknutie na tlačidlo) iniciuje volanie príkazu vo ViewModel.

Výhody:

• Rozdelenie zodpovedností: jasné rozdelenie medzi UI, podnikovou logikou a logikou prezentácie.
• Testovateľnosť: ViewModel je ľahko testovateľný nezávisle od View.
• Zlepšená údržba: zmeny v jednej časti systému majú menší vplyv na ostatné.
• Vývoj: frontendoví a backendoví vývojári môžu pracovať paralelne.

Príklad konceptu viazania dát (pseudo-kód):

// ViewModel
class CounterViewModel {
  count = 0; // sledovateľná vlastnosť

  increment() {
    this.count++; // spustí oznámenie o zmene
  }
}

// View (zjednodušená reprezentácia)
<button onclick="viewModel.increment()">+</button>
<span data-bind="textContent: viewModel.count"></span> // viaže obsah span na viewModel.count