Creating Tomorrow’s Web Applications Using Today’s Technologies
Creating Tomorrow’s WebApplications Using Today’sTechnologiesMike SuarezSenior Consultantemail: MikeSu@magenic.com
Goals of Presentation» Discuss these Patterns & Technologies: » MVC Pattern » ASP.Net MVC 3 » HTML5 » Modernizr » jQuery» Create an application from scratch that: » Consumes the services created in this morning’s session » Demonstrates the power & ease of use of above technologies
MVC & ASP.Net MVC» MVC » The Design Pattern known as Model-View-Controller» ASP .Net MVC 3 » A Framework developed by Microsoft to help facilitate implementation of the MVC Pattern.
Model-View-Controller» Been around a long time.» Derived other patterns (i.e. MVP, MVVM)» Has many implementations» Major components: » Model: The Domain (Business Logic) » View: The UI (UI Logic) » Controller: Mediates between the Model & View (Input Logic)» Major benefits: » Better organized code (Separation of concerns) » Unit Testability
ASP.Net MVC Framework» Major Components: » Controller - class of Actions, invoked by HTTP requests. » View - HTML mixed with C# (or VB) that gets invoked by an Action, rendered by the View Engine, and displayed by the browser. » Model - an object that encapsulates business logic, data retrieval & data persistence.» Key Features/Benefits: » Routing - Straightforward handling of HTTP requests. » Base Classes – Keep your Controller clean, straightforward. » Convention over Configuration – Simple to implement. » Scaffolding - Reduces time to get development underway. » View Engine – Clean blend of HTML and C#. » Helper Methods – Reduce HTML & saves time.
Other concepts you’ll see in the Demo» ViewModels » A class to leverage ASP.Net MVC 3 Model Binding. » Not quite the same as ViewModel in MVVM implementations seen in WPF & SL.» Dependency Injection » Allows Dependencies to be injected into an object at run time. » Will be demonstrated in the controller’s constructor. » Gives us the ability to mock up dependencies for automated unit tests. » Although our implementation doesn’t fully adhere to the Dependency Inversion Principle, ASP.NET MVC 3 contains an IDependencyResolver interface for that. 6
What is HTML5?» Goals: » A more stringent set of guidelines for how layout engines implement existing tags/attributes. » An updated set of tags and attributes to allow you to do more with HTML.» Benefits: » Better compatibility among browsers. » Richer web experience. » Onus on browser (layout engine) to implement. » Less coding/dependence on plug-ins 7
Modernizr» Reality about HTML5... Great concept, but... » Specification is a “living document”. » No completion date in sight. » Browsers are adopting the specs at different rates.» Therefore » Feel free to use new HTML5 features. » But be prepared that the intended cross browser compatibility is still a ways away.» Modernizr » A lightweight JS library to assist in: » Detecting if certain new features are implemented in the browser your app is running in. » Handling cases where features haven’t been implemented by the browser. 8