Webes alkalmazások fejlesztése 9. előadás Bevezetés az ASP.NET MVC keretrendszerbe
ASP.NET MVC Framework 2009-ben jelent meg az első verziója, azóta folyamatosan fejlesztik Nyílt forráskódú Microsoft technológia Szerveroldali webprogramozáshoz keretrendszer Modell-View-Controller (MVC) tervezési mintára épül Jelenleg az ASP.NET WebForms-al fejlesztik párhuzamosan és 4.0-ás verziónál tart Szabó Tamás (sztrabi@inf.elte.hu) - sztrabi.web.elte.hu - Webes alkalmazások fejlesztése 2
Konkurencia Python Django Ruby Ruby On Rails PHP CodeIgniter Symphony Zend Framework Java Spring Web MVC Szabó Tamás (sztrabi@inf.elte.hu) - sztrabi.web.elte.hu - Webes alkalmazások fejlesztése 3
Model-View-Controller tervezési minta Vezérlő (Controller) o o Modell: Az adatok kezeléséért felelős réteg. Nézet: A weblapok megjelenítéséért felelős réteg Adatbázis Modell (Model) Nézet (View) Program o Vezérlő: Ide kerül az üzleti logika, ő vezérli, hogy melyik nézet jelenjen meg a felhasználónak és kezeli a különböző interakciókat. Szabó Tamás (sztrabi@inf.elte.hu) - sztrabi.web.elte.hu - Webes alkalmazások fejlesztése 4
MVC és MVVM összehasonlítása Nézet (View) Nézetmodell (ViewModel) Modell (Model) o Az MVC a tapasztalat szerint, jobban bevált a nagyobb webes alkalmazásoknál o A két minta nagyon hasonlít egymásra, de nem ugyanaz a kettő: MVVM-ben a nézetmodell nem ugyanazt a szerepet tölti be, mint MVC-ben a vezérlő. Amíg a vezérlő felelős azért, hogy mely nézet jelenjen meg, addig a nézetmodell nem tudja ezt meghatározni. Szabó Tamás (sztrabi@inf.elte.hu) - sztrabi.web.elte.hu - Webes alkalmazások fejlesztése 5
Keretrendszer működése Vezérlő Akció metódus Kliens Kérés küldése Nézet meghatározása Nézet Akció metódus Legenerált HTML oldal HTML oldal Nézet generálása Szabó Tamás (sztrabi@inf.elte.hu) - sztrabi.web.elte.hu - Webes alkalmazások fejlesztése 6
További technológiák Szerver oldalon (.NET technológiák) Dependency Injector.NET-hez (Ninject) Mocking Library (Moq) Unit Testing Framework (nunit) Kliens oldalon (Javascript technológiák) jquery (Core, UI, Mobile stb.) Knockout (adatkötés, MVVM) Prototype.js Szabó Tamás (sztrabi@inf.elte.hu) - sztrabi.web.elte.hu - Webes alkalmazások fejlesztése 7
Előkészületek Microsoft Visual Studio 2010 Ultimate NuGet Package Manager (opcionális) Web Platform Installer ASP.NET MVC 3 Microsoft Visual Studio 2012 Ultimate ASP.NET MVC 4 Szabó Tamás (sztrabi@inf.elte.hu) - sztrabi.web.elte.hu - Webes alkalmazások fejlesztése 8
DEMO Hello World weboldal elkészítése Szabó Tamás (sztrabi@inf.elte.hu) - sztrabi.web.elte.hu - Webes alkalmazások fejlesztése 9
ASP.NET - View Engine A HTML oldalak generálását az ASP.NET-en belül a különböző View Engine-ek végzik A keretrendszer felépítéséből adódóan lehetőség van arra, hogy különböző nézetmotorokat definiáljunk és használjunk Saját nézetmotor készítéséhez két interfészt kell implementálni: IViewEngine és IView, illetve regisztrálnunk kell az alkalmazásunkban, amit a ViewEngine.Engines tulajdonságon keresztül tudjuk megtenni Ha nem szeretnénk teljesen az alapoktól újraírni, akkor a már meglévő beépített nézeteket (RazorViewEngine és WebFormViewEngine) is felhasználhatjuk Szabó Tamás (sztrabi@inf.elte.hu) - sztrabi.web.elte.hu - Webes alkalmazások fejlesztése 10
ASP.NET - View Engine ASPX View Engine használata (lásd eddigi előadások) Razor View Engine (ezt érdemes használni): ASP.NET MVC 3-tól elérhető @<nyelvi szerkezet vagy kifejezés> @:<szöveg> - Egyszerű szöveget generál @using <névtér>.net-es névtér használata a nézet oldalon @model <típus> a Model tulajdonság típusának megadása (alapértelmezetten dynamic) @section <név> - egy előre definiált részterületet lehet megadni vele @helper <metódus> - Helper metódusokat lehet definiálni nhaml nem XML alapú view engine Szabó Tamás (sztrabi@inf.elte.hu) - sztrabi.web.elte.hu - Webes alkalmazások fejlesztése 11
Akció osztályok ActionResult Absztrakt ősosztálya az összes akcióosztálynak ViewResult - egy előre beállított nézetet rajzol ki RedirectResult - A megadott URL-re továbbítja a felhasználót PartialViewResult - egy előre beállított parciális nézetet rajzol ki EmptyResult - Egy üres választ ad vissza JsonResult - Egy megadott ViewData objektumot szerializál JSON objektumra JavaScriptResult - Egy megadott Javascript kóddal tér vissza, amit a kliens képes futtatni ContentResult - a válaszfolyamba írja közvetlenül magát a visszatérési értéket, így nincs szükség külön nézetre FileContentResult/FilePathResult - Egy fájllal tér vissza FileStreamResult - Egy FileStream-el tér vissza Szabó Tamás (sztrabi@inf.elte.hu) - sztrabi.web.elte.hu - Webes alkalmazások fejlesztése 12
DEMO To-Do-Site weboldal elkészítése Szabó Tamás (sztrabi@inf.elte.hu) - sztrabi.web.elte.hu - Webes alkalmazások fejlesztése 13
URL Routing Az ASP.NET MVC lehetőséget biztosít arra, hogy a programozó saját URL címsablonokat definiáljon a webes alkalmazásához Segítségével a felhasználó egyszerűebben és gyorsabban juthat el a rendszerünk különböző funkcióihoz Melyiket egyszerűbb megjegyezni: http://mywebsite.com/articles/2012-12-13 http://mywebsite.com?type=articles&date=2012-12-13 Szabó Tamás (sztrabi@inf.elte.hu) - sztrabi.web.elte.hu 14
URL Routing Bármilyen URL sablont készíthetünk, rendszerünk számára, illetve bármennyit megadhatunk, akár vezérlőkre és akciómetódusokra is lebontva Általában szegmensekre tagoljuk az URL címünket és a szegmensek helye alapján találjuk ki, hogy éppen mit kell tenni: http://mywebsite.com/articles/2012-12-03 weboldalunk címe akciónk neve dátum szerinti szűrés Szabó Tamás (sztrabi@inf.elte.hu) - sztrabi.web.elte.hu 15
Validáció Nem elég kliensoldalon ellenőrizni az adatok helyességét, hanem szerver oldalon is szükség van rá, ezért az ASP.NET MVC keretrendszer több lehetőséget is biztosít a minél hatékonyabb és kényelmesebb validációhoz: Kliens oldali validáció: Kliens oldalon Javascript segítségével ellenőrizzük az adatokat. Így nem generálunk fölösleges adatforgalmat egy-egy rossz érték esetén. Model validációs attribútumok: A modell osztályok tulajdonságait, különböző attribútumokkal látjuk el Önvalidáló modellek (Self-validation models): Ezek az objektumok önmagukat tudják validálni (IValidatableObject), azaz lehetőség van arra, hogy a validációs logikát a model rétegbe helyezzük. Explicit model validáció: A validáció a vezérlőben kerül elvégzésre, a ModelState tulajdonságon keresztül. Szabó Tamás (sztrabi@inf.elte.hu) - sztrabi.web.elte.hu 16
Szűrők használata (Filtering) Egyszerű és elegáns módszert kínál olyan dolgok implementálására, amik nem igazán illeszkednek az MVC-s tervezési mintába Jellemzően loggolásra, felhasználók azonosítására és cachelésre szoktuk használni Saját szűrőket is definiálhatunk, ehhez az IActionFilter interfészt kell implementálnunk. Két metódust kell megírnunk: OnActionExecuting: Az akciómetódus lefutása előtt hívódik meg OnActionExecuted: Az akciómetódus lefutása után hívódik meg Szabó Tamás (sztrabi@inf.elte.hu) - sztrabi.web.elte.hu - Webes alkalmazások fejlesztése 17
ASP.NET Web API Egy újabb Microsoft technológia, amivel egyszerűen és gyorsan készíthetünk web szervert az MVC tervezési minta segítségével Először a WCF technológia része volt, de tavaly kikerült onnan és az ASP.NET-hez tették Cél, hogy HTTP kéréseken keresztül érhessük el a rendszerünk különböző szolgáltatásait, majd a válaszokat JSON vagy XML formátumban küldjük vissza a kliens részére A vezérlők nem a Controller osztályból vannak származtatva, hanem az ApiController-ből, ennek megfelelően kicsit más logikával működnek Könnyen illeszthető már meglévő MVC-s alkalmazásainkhoz Szabó Tamás (sztrabi@inf.elte.hu) - sztrabi.web.elte.hu - Webes alkalmazások fejlesztése 18
TypeScript programozási nyelv Microsoft 2012. szeptemberében adta ki a 0.8-as verzióját a nyelvből, nyílt forráskódú, platform- és operációsrendszer független Anders Hejlsberg (Pascal, Delphi, C#) is részt vesz a projektben Statikus típusrendszere van, illetve magasabb szintű nyelvi eszközöket kínál az objektum-orientált programozáshoz(osztályok, modulok, interfészek stb.) Célja, hogy a Javascript nyelv tervezési hibáit valamilyen szinten javítsa, illetve megfelelő eszközt nyújtson nagyobb projektet készítésére is Rohamosan fejlődik, a következő verzióban (0.9) már a nyelv támogatni fogja a generikus típusokat is Szabó Tamás (sztrabi@inf.elte.hu) - sztrabi.web.elte.hu - Webes alkalmazások fejlesztése 19
Hasznos linkek és könyvek Linkek http://www.asp.net/ http://www.codeproject.com/ www.google.com http://www.typescriptlang.org/ Könyvek Pro ASP.NET MVC 3 Framework Steven Anderson, Adam Freeman, Apress 2011 Pro ASP.NET MVC 4 Adam Freeman, Apress 2012 Pro C# 2010 and the.net 4 Platform Andrew Troelsen, Apress 2010 Szabó Tamás (sztrabi@inf.elte.hu) - sztrabi.web.elte.hu - Webes alkalmazások fejlesztése 20
Köszönöm a figyelmet! Szabó Tamás (sztrabi@inf.elte.hu) - sztrabi.web.elte.hu - Webes alkalmazások fejlesztése 21