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  » jQu...
MVC & ASP.Net MVC» MVC  » The Design Pattern known as Model-View-Controller» ASP .Net MVC 3  » A Framework developed by Mi...
Model-View-Controller» Been around a long time.» Derived other patterns (i.e. MVP, MVVM)» Has many implementations» Major ...
ASP.Net MVC Framework» Major Components:  » Controller - class of Actions, invoked by HTTP requests.  » View - HTML mixed ...
Other concepts you’ll see in the Demo» ViewModels  » A class to leverage ASP.Net MVC 3 Model Binding.  » Not quite the sam...
What is HTML5?» Goals:  » A more stringent set of guidelines for how layout engines implement    existing tags/attributes....
Modernizr» Reality about HTML5... Great concept, but...  » Specification is a “living document”.  » No completion date in ...
jQuery» What is jQuery?  » THE JavaScript library of JavaScript libraries.  » Used by over 55% of the 10,000 most visited ...
Without further ado…»Lets Start Coding!!!                       10
Upcoming SlideShare
Loading in …5
×

Creating Tomorrow’s Web Applications Using Today’s Technologies

1,368 views

Published on

At Code Mastery Boston Mike Suarez, Senior Consultant at Magenic talked about Patterns & Technologies including: MVC Pattern, ASP.Net, MVC 3, HTML5, Modernizr, and jQuery

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
1,368
On SlideShare
0
From Embeds
0
Number of Embeds
352
Actions
Shares
0
Downloads
9
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Creating Tomorrow’s Web Applications Using Today’s Technologies

  1. 1. Creating Tomorrow’s WebApplications Using Today’sTechnologiesMike SuarezSenior Consultantemail: MikeSu@magenic.com
  2. 2. 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
  3. 3. 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.
  4. 4. 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
  5. 5. 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.
  6. 6. 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
  7. 7. 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
  8. 8. 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
  9. 9. jQuery» What is jQuery? » THE JavaScript library of JavaScript libraries. » Used by over 55% of the 10,000 most visited websites.» Reasons for Popularity » Provides extensive functionality. » Takes cross browser issues into account. » Allows DOM elements to be “queried” with same ease of CSS selectors. » Drastically reduces the amount of JS code. 9
  10. 10. Without further ado…»Lets Start Coding!!! 10

×