TIP: Přetáhni ikonu na hlavní panel pro připnutí webu
Po dlouhém přemýšlení nad názvem tohoto nového seriálu jsem dospěl k tomu, že ho pojmenuji „stručně“ podle hlavní technologie, kterou budeme používat, a zároveň se pokusím vystihnout účel seriálu. Tím je ukázat vám, čtenářům, užití této technologie v praxi, od absolutních základů, až do kompletně hotové a funkční aplikace. Nedejte se ale zmást, nepoužijeme zdaleka jen ASP.NET MVC, ale také AJAX nebo LINQ to SQL.
Nejlepší způsob, jak se naučit něco nového, je použít danou věc v praxi. V tomto seriálu postavíme od základů aplikaci NerdDinner, která bude sloužit pro online plánování večeří s přáteli. Seriál je překladem jedné kapitoly z knihy Professional ASP.NET MVC 1.0 z per pánů R. Coneryho, S. Hanselmana, P. Haacka a ASP.NET legendy Scotta Guthrieho. Tato jedna kapitola byla uvolněna zdarma už před několika měsíci a osobně ji považuji za jeden z nejlepších zdrojů k naučení ASP.NET, a proto jsem se rozhodl, že jím obohatím i české luhy a háje.
K samotné tvorbě, jak už bylo naznačeno, využijeme technologií ASP.NET MVC, AJAX.NET, LINQ to SQL a setkáme se i s mapami, prací s databází, regulárními výrazy a dalšími populárními technologiemi.
Budu používat Visual Studio 2008 s doplňkem pro ASP.NET MVC 1.0, .NET Framework 3.5 a SQL Server 2008 Developer Edition (pokud máte Express verze, tak to vůbec ničemu nevadí, jen přijdete o vestavěnou podporu unit testů).
Tolik k úvodu, ještě si ukážeme screenshot toho, čeho během pár dílů dosáhneme, a vrhneme se na to!
Začneme zapnutím Visual Studia a založením nového projektu pomocí položek File > New Project v menu. Vybereme ASP.NET MVC Web Application a pojmenujeme ji NerdDinner.
Po kliknutí na tlačítko OK na nás vyskočí další okno, tázající se na to, jestli chceme do solution přidat i projekt s unit testy. Unit testy jsou výborná věc pro, kdo by to byl řekl, testování aplikace. Díky striktnímu oddělení Controllers, Views a Models můžeme tyto jednotlivé části testovat jako nezávislé jednotky (proto unit testy). Také na ně v tomto seriálu dojde, takže vše necháme tak, jak to je, a opět potvrdíme tlačítkem OK.
Nic takového se vám nezobrazilo? V tom případě používáte Express nebo Standard verzi Visual Studia. Bohužel je podpora pro unit testy vestavěná jen do Visual Studia Professional a vyšší. Můžete si ale stáhnout jiný testovací framework, jako například NUnit, MBUnit nebo XUnit.
Struktura projektu NerdDinner
Hned po vytvoření MVC projektu nám Visual Studio předhodí poměrně bohatý výčet adresářů v projektu, pojďme se na ně tedy teď mrknout.
Nejvýše v projektu máme 6 adresářů, jejichž význam shrnuje následující tabulka:
| Adresář | Účel |
| /Controllers | pro Controllery |
| /Models | pro Modely |
| /Views | pro Views |
| /Scripts | pro JavaScriptové knihovny a skripty |
| /Content | pro CSS soubory, obrázky a podobné soubory |
| /App_Data | pro soubory, do kterých zapisujeme/čteme z nich (databázové .mdf soubory, XML soubory, …) |
Tato struktura ale není vyžadovaná, můžete se setkat třeba i s tím, že vývojář rozdělí aplikaci do více projektů (například z Modelů vystaví samostatnou DLL knihovnu). Přesto ale poskytuje do začátku hezké logické rozdělení pro části aplikace, proto se jí budeme tentokrát držet.
Pokud rozklikneme adresář Controllers, uvidíme, že obsahuje dvě Controller třídy – HomeController a AccountController. Až aplikaci spustíme, tak uvidíte, jaký mají praktický význam. Zatím prozradím, že Controllery jsou tvořeny tzv. akčními metodami (to jsou ty, které vrací ActionResult) a MVC framework defaultně sestavuje URL ve tvaru {Controller}{Akční_Metoda}. Pokud nahlédneme dovnitř třídy HomeController, tak v něm mimo jiné najdeme akční metodu Index. Později uvidíte, že URL HomeIndex je tedy naprosto v pořádku a skutečně zobrazí stránku Index.
Uvnitř adresáře Views najdeme tři podadresáře - /Home, /Account a /Shared - a v nich několik .aspx šablon. Jak už jsme si řekli minule, Controller předává data View a ten je právě pomocí této šablony zobrazí. Zapadá to do sebe jako skládačka: názvy podadresářů odpovídají Controllerům (HomeController a AccountController, jen adresář Shared je sdílený) a šablony v nich zase odpovídají příslušným akčním metodám (třeba metoda Index v předchozím odstavci).
Při nahlédnutí do adresáře Content objevíme soubor Site.css, který dává vzhled celému ukázkovému webu, a uvnitř adresáře Scripts nalezneme pár JavaScript knihoven, které dodávají aplikaci podporu pro AJAX a jQuery.
Nakonec v projektu NerdDinner.Tests v adresáři Controllers uvidíme dvojici tříd, které obsahují testy pro Controllery Account a Home.
To, co jsme si v posledních několika odstavcích popsali, tvoří ukázkovou funkční aplikaci, kterou Visual Studio vždy vytvoří při vzniku nového MVC projektu. My si teď tuto aplikaci spustíme a dokážeme si, že to, co jsem říkal o vztahu URL, Controllerů a akčních metod, je pravda :-).
Spuštění aplikace
Stiskněme kouzelnou klávesu F5, aplikace se zkompiluje a před námi se objeví to, co na obrázku níže.
Klikneme-li na tlačítko About, dostane se na stránku typu „O aplikaci“. Hlavně si všimněte URL. Přesně odpovídá Controlleru Home a jeho akční metodě About:
Teď to zkusíme obráceně, dostaneme se na nějakou stránku ne pomocí tlačítka, ale pomocí změny URL. Máme Controller Account a v něm akční metodu LogOn. Co se asi stane?
Myslím, že touto dobou už základní myšlenku chápete, můžete si zkusit spustit i další akční metody.
Testování aplikace
Pokud používáte Professional (nebo vyšší) verzi Visual Studia, můžete využít vestavěné podpory pro unit testy k otestování jednotlivých částí aplikace. Opět jich máme několik předpřipravených (27, abych byl přesný), můžete je spustit z menu pomocí položek Test > Run > Tests in Current Context. Testy se provedou a v okně Test Results se objeví výsledky, vše by mělo proběhnout v pořádku. Nebojte, později prozkoumáme unit testy podrobněji.
Dnes jsme jen velmi zlehka prozkoumali typický MVC projekt, ze kterého bude naše NerdDinner aplikace vycházet. V příštím díle vytvoříme databázi, kterou budeme potřebovat.
