Il pattern architetturale MVC (Model View Controller) favorisce la manutenzione delle applicazioni web tramite una architettura elegante ed una chiara ed esplicita separazione delle competenze, l'impiego dei più diffusi pattern di software engineering, il controllo completo dell'HTML generato e degli URL, la testabilità ed estendibilità. In questa sessione vedremo le novità principali di Asp.Net MVC in versione 3. La sessione è stata tenuta a SMAU Business Bologna il 9 giugno 2011

1. ASP.NET MVC 3 Benedetti Stefano

2. Contatti Ing. Stefano Benedetti http://www.be-st.it http://blog.be-st.it info@be-st.it Lo User Group dell'Emilia-Romagnainteramente dedicato alle tecnologie Microsoft .NET http://dotdotnet.org/

3. Agenda MVC Overview scaffolding supporto HTML 5 viewengineRazor miglioramenti sui controller nuove funzionalità Javascript e AJAX integrazione con NuGet miglior supporto alla DependencyInjection altre features

4. MVC Overview Pattern di presentazione

5. MVC Overview Originariamente impiegato dal linguaggio Smalltalk Smalltalk è stato sviluppato allo Xerox PARC durante gli anni settanta

6. Vantaggi SeparationofConcerns (SoC) UnitTesting DI Nessun viewstate Controllo completo dell’HTML Scomparsi i controlli server e gli ID autogenerati No PageLifeCycle Performance Semplicità

7. ASP.NETPage life cycle

8. MVC Routing Disaccoppiamento tra URL e pagina fisica /products /products/detail/1 /products/edit/1 /products/delete/1 Get Post Configurabile tramite Global.asax Convention overconfiguration ProductsController

9. Global.asx e MapRoute public staticvoidRegisterRoutes(RouteCollectionroutes) { routes.MapRoute( "Default", // Routename "{controller}/{action}/{id}", // URL with parameters new { controller = "Home", action = "Index", id = UrlParameter.Optional } // Parameterdefaults ); }

10. MVC Routing www.sito/product public classProductController : Controller { public ViewResultIndex() {varproducts = db.Products.Include(p => p.Brand); returnView(products.ToList()); } } Default Action (Index)

11. MVC Routing products/details/1 public classProductController : Controller { public ViewResultDetails(intid) { Productproduct = db.Products.Find(id); returnView(product); } }

12. MVC Routing GET: /Product/Edit/5 public ActionResultEdit(intid) { Productproduct = db.Products.Find(id); ViewBag.BrandId = new SelectList(db.Brands, "Id", "Name", product.BrandId); returnView(product); }

13. MVC Routing e ModelBinding POST: /Product/Edit/5 [HttpPost] public ActionResultEdit(Productproduct) { if (ModelState.IsValid) { db.Entry(product).State = EntityState.Modified; db.SaveChanges(); returnRedirectToAction("Index"); } ViewBag.BrandId = new SelectList(db.Brands, "Id", "Name", product.BrandId); returnView(product); }

14. Requisiti Per il runtimeASP.NET MVC 3: .NET Framework version4 ASP.NETMVC 3 Visual Studio 2010 tools: VisualStudio 2010 o Visual Web Developer 2010 Express

15. Installazione Side by side con MVC 2 Web PlatformInstaller (WebPI) http://www.microsoft.com/web/gallery/install.aspx?appid=MVC3 Download diretto http://go.microsoft.com/fwlink/?LinkID=208140

16. NuGet Library Package Manager Estensione di Visual Studio Automazione: Download Package folder Reference Web.config Configurazione custom Gestione update Post e guida di base su blog.be-st.it

17. NuGet DEMO

18. NuGet in MVC 3 Versione 1.2 Package pre-installati Modernizr Entity Framework Code First JQuery

19. Scaffolding Creazione dell’impalcatura “Add Controller” ha 3 modalità di scaffolding: Empty controller Controller withemptyread/writeactions Controller withread/writeactions and view, usingEntity Framework

21. Scaffolding Alternativa: MVCScaffolding Package NuGet http://blog.stevensanderson.com Pro ASP.NET MVC V2 Framework

22. HTML 5 I template di progetto supportano HTML 5

23. HTML 5 Nuovi tag Header Footer Nav Section Validazione HTML 5 in VS 2010

26. ViewEngine “Razor” Concisa Facile da imparare Intellisense e evidenziazione del codice Razor in Visual Studio

27. ViewEngine “Razor” Definizione del model: @model Commenti: @* *@ Impostazioni di default (ad es. layoutpage) Html senza encoding: Html.Raw Codice condiviso tra le view (_viewstart.cshtml) “Master page”: layout

28. Razor Layout

29. ViewEngineSupport Default Web Forms (ASPX) Razor Spark NHaml NDJango

30. Nuovi HTML Helpers Chart WebGrid Crypto WebImage WebMail

31. Chart DemoHtmlHelpersController public ActionResult Chart() { var key = new Chart(width: 600, height: 400) .AddSeries( chartType: "bar", legend: "Rainfall", xValue: new[] { "Jan", "Feb", "Mar", "Apr", "May" }, yValues: new[] { "20", "20", "40", "10", "10" }) .Write(); returnnull; }

32. Chart View <p> <imgsrc="/DemoHtmlHelpers/Chart" alt="Chart" /> </p>

33. WebGrid @{ vargrid = newWebGrid(source: Model, rowsPerPage: 3); } @grid.GetHtml(tableStyle: "grid", headerStyle: "head", alternatingRowStyle: "alt", columns: grid.Columns( grid.Column("Id"), grid.Column("Name") ) ) <tableclass="grid"> <thead><trclass="head"> <trclass="alt">

34. WebGrid Layout Sort Paginazione

35. WebImage varimagePath = Server.MapPath("~/images/dotdotnet.png"); varimage = newWebImage(imagePath); FlipVertical(); FlipHorizontal(); RotateLeft(); RotateRight(); Crop WaterMark Resize Formato immagine: JPEG, PNG (default), BMP, GIF

36. Miglioramenti ai controller Global ActionFilters Nuova ViewBagproperty Nuovi ActionResult

37. Global ActionFilters MVC 2: ActionFilters Codice da eseguire prima e dopo una SPECIFICA action Si applica sull’action o sul controller

38. Global ActionFilters MVC 3: Global ActionFilters Filtri da eseguire prima e dopo OGNI action di tutti i controller GlobalFilters

39. ViewBag MVC 2: ViewData Dictionary MVC 3: ViewBag DynamicProperty ViewData[“Message”] VS. ViewBag.Message

40. Nuovi ActionResult HttpNotFoundResult RedirectResult HttpStatusCodeResult Demo

41. Javascript e AJAX AJAX sfrutta NuGet (aggiornabile) UnobtrusiveJavaScript Default Client-Side Validation Remote validator Supporto al binding JSON

42. UnobtrusiveJavaScript Vantaggi Separazione tra codice e markup Performance e scalabilità Aggiornamento delle librerie per supportare nuove funzionalità/nuovi e vecchi useragent Svantaggi Sviluppo più lento Necessità di cercare eventuali JS associati ai tag

43. Separazione tra codice e markup <input type="text" name="date" onchange="validateDate()" /> <input type="text" name="date" id="date" /> $(function(){ $('#date').bind('change', validateDate); });

44. UnobtrusiveJavaScript – ON/OFF Web.Config – appSettings <add key="UnobtrusiveJavaScriptEnabled" value="true"/> HtmlHelper.UnobtrusiveJavaScriptEnabled Default: ON (sui nuovi progetti) OFF: compatibilità con MVC 1 e 2 Utilizza attributi compatibili con HTML 5

45. Unobtrusive JS: Performance OFF <form action="/ajax/callback" id="form0" method="post" onclick="Sys.Mvc.AsyncForm.handleClick(this, newSys.UI.DomEvent(event));" onsubmit="Sys.Mvc.AsyncForm.handleSubmit(this, newSys.UI.DomEvent(event), { insertionMode: Sys.Mvc.InsertionMode.replace, loadingElementId: 'loading', updateTargetId: 'updateme' });"> ON <form action="/ajax/callback" data-ajax="true" data-ajax-loading="#loading" data-ajax-mode="replace" data-ajax-update="#updateme" method="post">

46. Default Client-Side Validation MVC 2 Html.EnableClientValidation MVC 3 Default! Disabilitabile da web.config

47. Remote Validator RemoteAttribute JQueryValidation Demo

48. JSON Binding Il modelbinding è stato esteso per supportare JSON E’ possibile fare binding da un oggetto JSON ad un parametro di una action

49. JSON Binding

50. JSON Binding

51. ModelValidation DataAnnotations ValidationAttribute ValidationInterfaces

52. DataAnnotations Supporto diretto ai DataAnnotations DisplayAttribute

53. ValidationAttribute IsValidOverload Accesso all’oggetto in corso di validazione CompareAttribute

54. ValidationInterfaces IValidatableObject Validazione a livello di model Stato del model Confronto tra proprietà del model

55. ValidationInterfaces

56. DependencyInjection Cos’è Le dipendenze non sono all’interno del componente Le dipendenze vengono iniettate

57. Nessuna injection public classOrderManager { public voidProcessOrder() { varlogger = newLogManager(); logger.Log(); } }

58. DI: constructorinjection public classOrderManagerDI { private readonlyILog_logger; public OrderManagerDI(ILoglogger) { _logger = logger; } public voidProcessOrder() { _logger.Log(); } }

59. DI in pratica = IOC Le dipendenze possono essere moltissime ed in cascata La risoluzione delle dipendenze viene demandata ad un gestore esterno L’IOC si occupa di gestire le dipendenze a runtime Esempio: Ninject

60. DependencyInjection Controllers Views ActionFilters ModelBinders Modelvalidation Modelmetadata Valueproviders

61. Altre nuove features Partial-page output caching Estendibilità della finestra “New Project” OverloadsHtml.LabelFor e Html.LabelForModel Supporto alla sessione nei controller AdditionalMetadataAttribute Nuovo AccountController Nuovo template di progetto “Intranet”

62. ASP.NET è morto? NO!

63. ASP.NET è morto? Intranet/web application “non pubbliche” Molto veloce sviluppare Infinità di controlli server sul mercato ASP.NET 4.0 sopperisce a molti limiti sul controllo dell’HTML

64. Riferimenti MVC Page su ASP.NET www.asp.net/mvc MSDN go.microsoft.com/fwlink/?LinkId=205717 ScottGu http://weblogs.asp.net/scottgu/

65. Riferimenti NuGet http://nuget.codeplex.com/ http://haacked.com/tags/NuGet/default.aspx http://blog.be-st.it/?tag=/nuget

66. That’s allfolks Grazie