1. Template designed by
cert-path
70-486: Developing ASP.NET MVC 4
Web Applications
Template designed by
Michele Aponte
Presidente DotNetCampania - MVP ASP.NET/IIS
CEO & Co-Founder Blexin Srls
michele.aponte@dotnetcampania.org
http://dotnetcampania.org/blogs/michele

2. Template designed by
brought to you by

3. Template designed by
• Esame 480: Programming in HTML5 with JavaScript
and CSS3
• Esame 486: Developing ASP.NET MVC 4 Web
Applications
• Esame 487: Developing Windows Azure and Web
Services
• (ve ne parlerà Roberto Freato nella sessione delle 13.20)
MCSD: Web Applications

4. Template designed by
• Design the application architecture (15-20%)
• Design the user experience (20-25%)
• Develop the user experience (15-20%)
• Troubleshoot and debug web applications (20-25%)
• Design and implement security (20-25%)
http://www.microsoft.com/learning/en-us/exam-70-486.aspx
agenda

5. Let’sgo
Design the application
architecture

6. Template designed by
Asp.Net MVC vi fornisce una naturale propensione alla
separazione delle responsabilità:
• La user interface viene definita nelle VIEW
• Le richieste dell’utente vengono gestite dalle ACTION dei
CONTROLLER
• La logica business viene gestista dal MODEL dell’applicazione
A seconda dei requisiti che avete decidete se gestire il risultato
di una richiesta client-side o server-side
Plan the application layers

7. Template designed by
Se avete requisiti di scalabilità scegliete tra una soluzione on-
premise, on-cloud o ibrida
• Per gestire efficacemente un alto numero di richieste potreste
avere più macchine in load balancing a rispondere agli utenti
• La gestione della sessione, nativamente in-process, in questi casi va configurata per essere
indipendente dalla macchina che sta servendo la richiesta:
• Database
• State Server
• Cache Distribuita
• Lo stesso vale per le risorse (immagini, file, ecc.): lo storage non deve essere locale alla
singola macchina
Design a distributed application

8. Template designed by
Se decidiamo di ospitare la nostra applicazione web in un cloud
service, possiamo intervenire in alcuni punti del ciclo di vita di
tale elemento
• OnStart()
• Run()
• StartupTask
Design and implement the Azure role life cycle

9. Template designed by
Http è un protocollo stateless, sta a noi utilizzare meccanismi di gestione dello
stato:
• Cookie
• Local storage
• Query string
• ViewState
• Session
Potete configurare da web.config la vostra strategia e usare provider custom per
favorire la scalabilità.
Configure state management

10. Template designed by
Per migliorare le performance dell’applicazione è possibile
implementare varie strategie di caching
• Output caching
• Data caching
• Http caching
• Azure caching
Design a caching strategy

11. Template designed by
In alcune circostanza può essere utile stabilire una connessione bidirezionale
tra client e server, in questo caso possiamo usare le Web Socket
• Upload di grandi quantità di dati in maniera asincrona (long-running
data transfer)
• Web games
• Qualsiasi esigenza di comunicazione bidirezionale in real-time
Ovviamente Web Socket deve essere supportato sia dal browser che dal
server, in alternativa si possono utilizzare anche tecniche come il long
polling. Se si vuole utilizzare una API che astrae al programmatore la tecnica
di comunicazione utilizzata è possibile utilizzare SignalR.
Design and implement a Web Socket strategy

12. Template designed by
Quando una richiesta arriva al nostro server questa viene processata da più
moduli HTTP dopodichè affidata a un singolo HTTP Handler
• Creando un modulo HTTP possiamo inserirci nella pipeline di IIS e fornire
comportamenti personalizzati nella gestione delle richieste
• Implementiamo gli eventi Init(HttpApplication) e Dispose() di IHttpModule
• Eventualmente gestiamo gli altri eventi del ciclo di vita del modulo
• Aggiungiamo l’handler alla pipeline da web.config (sezione <HttpModules>)
• Creando un event handler possiamo fornire il codice da eseguire in
risposta ad una particolare richiesta:
• Implementiamo l’evento ProcessRequest(HttpContext) e la proprietà IsReusable di IHttpHAndler
• Aggiungiamo l’handler al web.config (sezione <HttpHandlers>)
Design HTTP modules and handlers

13. Let’sgo
Design the user
experience

14. Template designed by
La definizione della user interface di un’applicazione web è costituita
da markup HTML, stili CSS e codice Javascript
• E’ possibile utilizzare media query (sia da CSS che da Javascript)
per adattare la UI allo spazio a disposizione
• L’eleborazione dinamica del DOM mediante javascript (e/o
jQuery) permette di aggiornare parti della pagina e
aggiungere/rimuovere classi CSS
• Framework come bootstrap semplificano la definizione della UI
delle applicazione web
Apply the user interface design for a web application

15. Template designed by
Per ottimizzare il traffico tra client e server ed evitare richieste
inutili al server è possibile utilizzare framework javascript e
plugin
• Validazione client side con jQuery unubontrusive validation
• Rendering parziale con Ajax
• Elaborazione del DOM con jQuery
Design and implement UI behavior

16. Template designed by
In MVC è possibile diminuire la complessità e favorire il riutilizzo
di parti di view:
• Partial View
• Layout e MasterPage
• Aspx e Razor View Engine
Compose the UI layout of an application

17. Template designed by
Garantire la compatibilità cross-browser è spesso un requisito
implicito delle applicazioni web:
• Verificare a run-time le feature disponibili del browser
• Usare proprietà CSS specifiche del vendor
• Broswer desktop e browser mobile
Enhance application behavior and style based on browser
feature detection

18. Template designed by
Per migliorare l’esperienza utente, molto diversa tra desktop e
mobile, possiamo adottare diverse strategie:
• Responsive design (Html5, CSS3, Javascript)
• Pagine diverse per dispositivi diversi (Display Modes)
• Framework per il mobile (jQuery Mobile)
Plan an adaptive UI layout

19. Let’sgo
Develop the user
experience

20. Template designed by
Il successo di un’applicazione web può dipendere fortemente da
come è indicizzata dai motori di ricerca:
• Usare tag semantici (HTML5) per dare significato ai contenuti
• Attributi ARIA per l’accessibilità
• Utilizzare gli strumenti di Visul Studio per verificare la
correttezza dell’HTML generato
Plan for search engine optimization and accessibility

21. Template designed by
Applicazioni che hanno un mercato internazionale (sul web è
molto frequente ) hanno necessità di essere
internazionalizzate:
• File di risorse
• Impostazione della culture corrente server side
• Impostazione della culture corrente client side
Plan and implement globalization and localization

22. Template designed by
In rispetto del principio di singola responsabilità in MVC potete
utilizzare «attributi» speciali per sollevare le action da alcune
funzionalità necessarie:
• Action Filters (Authorize, HandleError,
ValidateAntiForgeryToken, ecc.)
• Applicabili sulla singola action, sul controller o globalmente (Global Filters)
• Action Results (ViewResult, JsonResult, ecc.)
• Model Bindings
Design and implement MVC controllers and actions

23. Template designed by
Asp.Net MVC basa la sua configurazione su convenzioni. L’individuazione
del controller, la action e la view con cui rispondere ad una richiesta ad
esempio è basata sulla regola di routing di default. Il routing è un
componente importantissimo del framework e altamente personalizzabile:
• Regole di routing per specifici URL
• Route Constraints
• Custom route parameters
E’ possibile inoltre definire Aree specifiche dell’applicazione, per suddividere
una singola applicazione in più sezioni funzionali che rispondono a
particolare URL, come http://www.dominio.com/Admin/News/Details/1
Design and implement routes

24. Template designed by
Asp.Net MVC è un framework fortemente estendibile:
• Action Filters Custom
• Action Results Custom
• Controller Factory
• Model Binders Custom
• View Engines
Control application behavior by using MVC extensibility points

25. Template designed by
Lo scambio dati tra server è client è uno degli aspetti più
importanti da curare per migliorare le performance e la
responsività delle applicazioni web
• Bundles
• Minification
• Uso di CDN
Reduce network bandwidth

26. Let’sgo
Troubleshoot and debug
web applications

27. Template designed by
Avete vari strumenti a disposizione per individure problemi di
funzionamento e performance della vostra applicazione:
• Tracing
• Logging
• Debugging
• Intellitrace
• Code Contracts
• Performance Monitor
Prevent and troubleshoot runtime issues

28. Template designed by
Una applicazione ben sviluppata deve avere una buona
strategia di gestione delle eccezioni
• Gestione delle eccezioni tra layer applicativi diversi
• Pagine di errore custom
• Global.asax
• Http Handler Custom
• Web.config
Design an exception handling strategy

29. Template designed by
Asp.Net MVC favorisce la creazione di test automatici:
• Creare un progetto di unit test
• Mockare le dipendenze
• Istanziare un controller
• Invocare una action
• Fare una asserzione
• Eseguire i test
E’ inoltre possibile utilizzare i web tests e browser link
Test a web application

30. Template designed by
Quando hostiamo la nostra applicazione su Azure possiamo
debuggarla utilizzando:
• Azure Diagnostic API
• Event log, performance counter, crush dumps
• Intellitrace e RDP
• Remote debugging
• Server Explorer
Debug an Azure application

31. Let’sgo
Design and implement
security

32. Template designed by
Asp.Net supporta diversi tipi di autenticazione
• Form
• Windows
• Custom
Il framework fornisce una API, chiamata Membership API, che è possibile
personalizzare per utilizzare meccanismi di autenticazione custom.
In alternativa è possibile utilizzare Asp.Net Identity, la cui implementazione
di default utilizza Entity Framework Code First
Configure authentication

33. Template designed by
Una volta autenticato l’utente è possibile utilizzare i ruoli per
gestirne le autorizzazioni:
• Creare e associare ruoli agli utenti
• Impostare la configurazione dei permessi attraverso il
web.config o da codice
• Creare role provider custom
Configure and apply authorization

34. Template designed by
In scenari distribuiti è possibile utilizzare l’autenticazione
federata:
• Azure Access Control Service
• Custom security token con Windows Identity Foundation
• oAuth, OpenID, LiveID
Design and implement claims-based authentication across
federated identity stores

35. Template designed by
E’ possibile sfruttare le funzionalità crittografiche per:
• Crittografare i dati applicativi
• Crittografare le sezioni di configurazione
• Firmare le informazioni per impedirne il tampering
Manage data integrity

36. Template designed by
Mettere in sicurezza un’applicazione web, può significare:
• Utilizzare certificati per stabilire connessioni sicure (SSL)
• Hashing delle password
• Encoding dell’HTML
• Parametrizzare le query per impedire Sql Injection
• Cross-site request forgeries (XSRF)
Implement a secure site with ASP.NET

37. Template designed by
Grazie a tutti per la partecipazione
Riceverete il link per il download a slide e demo via email nei
prossimi giorni
Per contattarmi
michele.aponte@dotnetcampania.org
Grazie