Lekce 3 - Úvod do architektury MVC ve Spring Bootu pro Kotlin
V předchozí lekci, Vytvoření Spring Boot projektu v Kotlinu jsme si založili první projekt. Seznámili jsme se s prostředím a funkcí webové stránky.
V dnešním Spring Boot tutoriálu pro Kotlin se seznámíme s výhodami a smyslem MVC architektury pro webové aplikace. Popíšeme a vysvětlíme si používané termíny.
Základní myšlenkou MVC architektury je oddělení logiky od výstupu. Řeší tedy problém tzv. "špagetového kódu", kdy máme v jednom souboru (třídě) logické operace a zároveň renderování výstupu. Soubor tedy obsahuje databázové dotazy, logiku (např. operace v Kotlinu) a různě poházené HTML tagy. Vše je zamotané do sebe jako špagety.
Kód se samozřejmě špatně udržuje, natož rozšiřuje. Je špatně zvýrazněný, protože si s ním IDE neví rady, HTML není správně naformátováno, ztrácíme se v jeho stromové struktuře. Naším cílem je, aby zdrojový kód s logikou vypadal jako zdrojový kód v Kotlinu a výstup vypadal jako HTML stránka s co nejmenší příměsí dalšího kódu.
Komponenty MVC architektury
Celá webová aplikace je rozdělena do třech komponent, které tvoří tyto tři vrstvy:
- Model
- View (Pohled)
- Controller
Z tohoto rozdělení vzniknul název této architektury.
Termínu pohled se budeme zde vyhýbat, protože budeme používat anglické výrazy.
Komponenty jsou třídy zděděné z abstraktních tříd Model
,
View
a Controller
. Pojďme si jednotlivé komponenty
nejprve popsat.
Model
Model obsahuje logiku a vše, co do ní spadá. Mohou to být výpočty, databázové dotazy, validace a podobně. Model vůbec neví o výstupu. Jeho funkce spočívá v přijetí parametrů zvenku a vydání dat ven. Model neví, odkud data v parametrech přišla a ani jak budou výstupní data zformátována a vypsána.
Parametry není myšlena URL adresa, ani žádné jiné parametry od uživatele.
V kurzu budeme používat ORM
(Objektově-Relační
Mapování), v kterém modely přímo korespondují s
databázovými tabulkami. Máme tedy model User
,
Comment
nebo Article
. Instance modelů obsahují
atributy z databáze. Např. instance modelu User
může mít atribut name
.
Modelu můžeme definovat instanční metody. Takovou metodou
může být například metoda, která vypočítá věk uživatele podle jeho
data narození.
View
View se stárá o zobrazení výstupu uživateli. Nejčastěji se jedná o HTML šablonu obsahující HTML stránku a tagy nějakého značkovacího jazyka. Tento nám pak umožňuje do šablony vkládat proměnné, případně provádět iterace (cykly) a podmínky.
Např. pohled user.html
vypíše detaily o
uživateli, pohled clanek.html
vypíše obsah článku.
Pohledů máme mnoho, např. pro funkcionalitu s objektem
uživatel:
registration.html
,login.html
,
profile.html
a podobně. Pohled profile.html
je ale
již společný všem uživatelům a jsou do něj posílána
různá data, vždy podle toho, koho zrovna zobrazujeme. Tato
data jsou poté dosazena do HTML elementů šablony.
Šablony lze vkládat do sebe, abychom se neopakovali (šablona s rozvržením stránky, šablona s menu a šablona článkem).
View není jen šablona, ale také zobrazovač výstupu. Obsahuje tedy minimální množství logiky, která je pro výpis nutná (např. kontrola, zda si uživatel vyplnil přezdívku před jejím vypsáním nebo cyklus s komentáři, které se vypisují). View podobně jako Model vůbec neví, odkud mu data přišla, stará se jen o jejich zobrazení uživateli.
Controller
Controller je nyní onen chybějící prvek, který osvětlí funkčnost
celé architektury. Jedná se o jakéhosi prostředníka, se
kterým komunikuje uživatel, Model i View. Nejčastěji má
každá entita jeden controller, máme tedy UserController
,
ArticleController
a tak podobně. Controller drží celý systém
pohromadě a komponenty propojuje.
Webová aplikace a životní cyklus stránky
Podívejme se na základní funkcionality webových aplikací a životního cyklu webových stránek.
Webová aplikace
Největší "boom" webových aplikací přišel s rozmachem internetu, kdy bylo potřeba do původně statických webových stránek zanést dynamické prvky. A proto po nespočtu slepých uliček a omylů, se postupem času dosáhlo toho, že se webová stránka chová úplně stejně, jako desktopová aplikace. Takovýmto webovým stránkám se již říká webová aplikace.
Příkladem webové aplikace je například Google Docs, online alternativa k MS Office.
Webové aplikace fungují takto. Klient(například počítač) se zeptá serveru na určitý dokument. Na serveru běží program, který dokáže vygenerovat do stránky to, co uživatel požaduje. Stránka tedy na serveru neexistuje, ale je dynamicky vytvářena podle toho, co uživatel potřebuje.
Technologie Spring Boot nám umožňuje takové dynamické stránky na serveru vytvořit.
Životní cyklus stránky
Životní cyklus zahajuje uživatel, který zadá do
prohlížeče adresu webu a parametry, kterými nám sdělí,
kterou podstránku si přeje zobrazit.
Např. budeme chtít zobrazit detail uživatele s
id 15
. URL adresa by byla následující:
http://www.domena.cz/user/detail/15
Požadavek jako první zachytí tzv. router. Ten podle
parametrů pozná, že voláme UserController
.
UserController
podle parametrů detail
a
15
pozná, že voláme akci(metodu) Detail
, která
přijímá parametr 15
. Akce Detail
zavolá
model, který uživatele vyhledá v databázi a vrátí jeho údaje.
Dále zavolá další metodu modelu, která např. vypočítá věk uživatele.
Tyto údaje si controller ukládá do proměnných. Nakonec
vygeneruje view, do kterého předá proměnné s
příslušnými daty. Controller tedy poslechl uživatele, obstaral
podle parametrů dotazu data od Modelu a předal je View.
Celou situaci můžeme znázornit diagramem:
Získali jsme tedy oddělení logiky od výstupu, view jsou jako HTML soubory, modely jako třídy v Kotlinu. Dosáhli jsme přehlednosti kódu, který je logicky rozčleněný.
MVC architektura nám usnadňuje i myšlení při vývoji projektu. Logiku píšeme do Modelu, formátování a stylování výstupu řešíme ve View, to co uživatel chce zjištujeme z parametrů v Controlleru. 3 různé problémy na 3 různých místech, oddělené tak, aby do sebe nezasahovaly a nedělaly nám vývoj složitější.
V další lekci, Mapping (routing) v Kotlin Spring Boot, si vytvoříme první webovou aplikaci s využitím architektury MVC. Bude umět vygenerovat náhodné číslo, pozdraví uživatele jeho jménem a také se naučíme používat mapping.