Architektura MVC: definice, struktura, frameworky

MVC (model-view-controller) je populární architektura, která odděluje řídící logiku softwaru od datového modelu a uživatelského rozhraní. Využívá se zejména při vývoji webových aplikací a je tak součástí řady javascriptových i PHP frameworků. Pojďme se nyní na MVC podívat trochu podrobněji, postupně si zodpovíme následující otázky:

• co znamená zkratka MVC,
• jak vypadá struktura MVC architektury,
• jaké jsou výhody vývoje webových aplikací s využitím MVC,
• jaký je rozdíl mezi MVC a MVP,
• jaký je rozdíl mezi MVC a třívrstvou architekturou,
• co je MVC framework a které soubory knihoven do této skupiny patří.

Co je MVC?

Zkratka MVC označuje model-view-controler architekturu, která byla původně určena k vývoji desktopových aplikací. Postupem času se však přesunula spíš do webového segmentu, kde slouží k efektivnímu rozdělení aplikace na tři nezávislé části (komponenty). Každou část je možné zvlášť upravovat, aniž by se změna dotkla zbylých komponent.

Díky tomu lze do webových i desktopových aplikací rychleji přidávat nové funkce a udržovat programy čitelnější či strukturovanější. MVC je do jisté míry reakcí na takzvaný špagetový kód, kde se mísí části definující design, logiku aplikace nebo operace s databází.

Vztah MVC x špagetový kód můžeme přirovnat například k HTML a CSS, kde CSS od HTML odděluje kód, který definuje vzhled stránky. HTML kód přitom definuje strukturu obsahu, programátor jeho prostřednictvím stanoví, kde budou odstavce, kde obrázky a podobně. CSS soubor zase určí, jak bude odstavec vypadat, ku příkladu font nebo jeho barvu.

Design zůstává oddělen od funkcionality a struktury, přičemž zde má každá část kódu své místo. Stejně je tomu i u MVC, které od sebe odděluje funkční či datový model, prezentaci dat a řídící logiku.

Struktura MVC

Architekturu MVC je nutné brát pouze jako obecný pohled na to, jak bychom měli k vývoji webových aplikací přistupovat. Můžeme se setkat s různými výklady jejího principu i implementacemi. Každý MVC framework tedy může v praxi fungovat trochu jinak. To základní ovšem zůstává stejné – stavba MVC:

• model,
• view (pohled),
• controller (řadič).

Model představuje data a byznys (aplikační) logiku webové aplikace. Uchovává v sobě data či databázi a má na starosti veškeré výpočty nebo vyhodnocování pravdivosti. V e-shopech například zajišťuje přihlášení k uživatelskému účtu a vkládání zboží do košíku. Může také definovat pravidla pro dokončení objednávky nebo validaci dat z formulářů (zda nechybí nějaký údaj).

Neví o existenci dalších komponent – controller, view a slouží tak pouze k provedení jednotlivých procesů. Výsledná data nikam neodesílá, pohled (view) si je zde sám vyzvedne. Do modelu bychom proto neměli umisťovat prvky, které jsou závislé na stavu řadiče (controlleru) nebo pohledu.

View (pohled) zobrazuje data zpracovaná modelem a uživatelské rozhraní webové aplikace (například tlačítka či bannery). Určuje tedy, jakým způsobem mají být data prezentována v okně prohlížeče. Zpracované požadavky si sám vyzvedává z modelu.

Controller (řadič) je řídící jednotkou celé MVC architektury. Přijímá uživatelská (vstupní) data, která následně přiřadí příslušné aplikační logice (modelu) a následně pohled informuje o vykonání požadavku, aby si jej mohl v modelu vyzvednout.

Kód zajišťující obsluhu (řadič) je tímto způsobem oddělen od kódu aplikační logiky (model) a kódu zobrazujícího data (pohled). Můžeme se setkat také s obousměrnou komunikací mezi controllerem a view, měli bychom se však vyvarovat přístupu modelu do view a controlleru.

Příklad využití MVC architektury

MVC architekturu můžeme demonstrovat na příkladu, kde je naším cílem vývoj webové aplikace pro správu úkolů – To Do list. Zde model prezentuje seznam všech úkolů, view určuje, jak vypadá uživatelské rozhraní a jakým způsobem se zobrazí jednotlivé položky, controller řídí přidávání nebo modifikaci úkolů.

Uživatel ve webové aplikaci klikne na tlačítko pro přidání nového úkolu, řadič požadavek převezme a předá ho modelu. Ten zpracuje data, jako je název úkolu či deadline. View si v modelu upravený výpis vyzvedne a následně uživateli zobrazí v seznamu úkolů.

Lehce upravený princip bychom mohli rovněž přenést do reálného světa, konkrétně do prostředí kuchyně. Zde funkci modelů zastávají kuchaři, řadiče představují číšníci či servírky a view zaskakuje jídelní lístek a později oběd.

Číšník přijme objednávku od zákazníka, který si ji vybral z jídelního lístku, informuje kuchaře o požadavku, ti jídlo uvaří, oznámí číšníkovi, že je pokrm hotový a ten jej jako výsledek celého procesu postaví před zákazníka.

Výhody architektury MVC

Předchozí odstavce již nastínily některé výhody, které architektura MVC do tvorby webových aplikací přináší, můžeme je shrnout do následujících bodů:

• udržení přehledného kódu i u rozsáhlejších aplikací,
• snazší uplatnění specializace členů týmu a zjednodušená kooperace,
• možnost paralelního vývoje komponent,
• prostor pro logické seskupení souvisejících akcí,
• rychlé úpravy částí aplikace a doplnění funkcionality,
• snazší testování jednotlivých částí aplikace,
• kód zajišťující obsluhu, UI / UX design nebo logiku aplikace lze měnit, aniž by se změna dotkla dalších komponent.

Vývoj webových aplikací s využitím MVC architektury je tak výhodný pro projekty, ve kterých prozatím není známa jejich kompletní funkcionalita či finální podoba. Aplikaci díky tomu můžeme pružně přizpůsobit růstu podnikání, z čehož mohou těžit například startupy.

Architektura MVC je vhodná i pro agilní přístup k vývoji, složený z několika iterací, v nichž se průběžně přidávají funkce. Díky agile máme vždy přehled o postupu tvorby a prostor pro připomínky, ať už ze strany členů týmu nebo klienta.

MVC vs. MVP

Během programování nebo při sepisování zadávací dokumentace pro tvorbu appky se můžeme mimo pojem MVC setkat i se zkratkou MVP. MVP - model-view-presenter (neplést s Minimum Viable Product) je další architektura, jejíž struktura z původního MVC vychází. Principálně si však ze své předlohy ponechala pouze funkci modelu:

• model zde tedy zastává stejnou roli jako v prvním případě – stará se o zpracování či uchování dat a byznys logiku,
• view opět zajišťuje vykreslení uživatelského rozhraní, na rozdíl od MVC architektury však také čeká na vstup uživatele, který následně zasílá na vhodný presenter,
• presenter je i v tomto případě řídící logikou, jež dohlíží na úspěšnost celého procesu.

V praxi to funguje tak, že uživatel zadá nějaký požadavek, například na stažení PDF souboru. View požadavek převezme a zavolá příslušný presenter, ten kontaktuje model, který žádost zpracuje a view ji následně zobrazí uživateli – PDF soubor se stáhne nebo zobrazí v prohlížeči.

MVC vs. třívrstvá architektura

Členění architektury MVC do tří oddělených komponent může někdy vést k záměně s takzvanou třívrstvou architekturou. Struktura třívrstvé architektury:

• prezentační vrstva – vykreslení UI rozhraní (okno webové aplikace),
• byznys vrstva – výpočetní operace,
• datová vrstva – uchování dat.

Vrstvy spolu komunikují lineárně, panuje zde tedy hierarchické uspořádání. To znamená, že vstup z prezentační vrstvy musí nejprve projít přes byznys vrstvu a až pak se dostane k vrstvě datové. Uživatel komunikuje pouze s prezentační vrstvou a byznys vrstva představuje most mezi vrstvou nejnižší a nejvyšší.

MVC komponenty jsou oproti tomu rozložené pouze do dvou vrstev, které spolu nekomunikují lineárně, nýbrž prostřednictvím řadiče, jež předává řízení. V zásadě se jedná o zcela odlišná řešení, která však lze vzájemně kombinovat. Respektive MVC lze použít na úrovni prezentační vrstvy.

MVC frameworky

S MVC a vývojem webových aplikací jsou neodmyslitelně spjaty takzvané MVC frameworky, které jsou na této architektuře postavené. Nejprve si stručně shrňme, co je framework.

Co je framework?

Frameworky obecně jsou předpřipravené kusy kódu, které může programátor využít pro vyřešení standardní funkcionality či návrh designu. Jedná se tedy o prostředek pro usnadnění a zrychlení vývoje, jenž zjednodušuje opakovanou implementaci funkcí. Tyto kusy kódu může programátor dále podle potřeby upravovat.

Framework může být napsán v různých programovacích jazycích, například v Ruby, Pythonu, PHP či JavaScriptu. Na základě jazyka pak rozlišujeme javascriptové frameworky, PHP frameworky apod. Můžeme se však setkat i s členěním na základě architektury: MVC framework, MVP framework, MVVM framework atd.

MVC frameworky najdou své využití zejména u webových aplikací, které jsou náročné na klientskou část nebo tam, kde je třeba zajistit asynchronní připojení k back-endu. Hodí se pro implementaci funkcí, u kterých by opětovné načtení stránky narušilo uživatelský zážitek (UX).

Příklady MVC frameworků

• Framework Ruby on Rails je určený pro rychlou tvorbu moderních webových aplikací. Vychází z jazyka Ruby, díky kterému nabídne velice specifickou syntax a snazší práci s databází, která je zde prezentována formou objektu. Hodí se pro vývoj jednostránkových aplikací a projekty, kde nás tlačí čas.
• Django je framework napsaný v Pythonu. Využití najde v rámci tvorby obsahových webů či aplikací, kde nám usnadní práci například automatickou tvorbou administrační části projektu.
• Symfony patří mezi MVC frameworky napsané v PHP. Je vhodný pro rozsáhlé podnikové projekty a chlubí se širokou komunitou či snadnou instalací a konfigurací.
• Ember řadíme mezi javascriptové frameworky, ideální pro tvorbu single-page applications (SPA). Umožňuje rychlý vývoj a prototypování webových aplikací, které vycházejí z konvenčního přístupu k programování.
• Vhodným nástrojem může být také AngularJS, který obsahuje obrovské množství knihoven.

Při výběru architektury nebo frameworku bychom se měli řídit konkrétními požadavky na funkce aplikace. Pokud si nejste jisti, které řešení je pro vás nejvhodnější, neváhejte využít naší bezplatné konzultace, rádi vám poradíme a vytvoříme webovou aplikaci podle vašich představ.