Building Single Page Apps for desktop, mobile, tablet with ASP.NET MVC 4
-
Upload
shravan-kumar-kasagoni -
Category
Technology
-
view
3.472 -
download
3
description
Transcript of Building Single Page Apps for desktop, mobile, tablet with ASP.NET MVC 4
Building Single Page Apps for desktop, mobile, tablet with ASP.NET MVC 4
Shravan Kumar KasagoniMicrosoft MVP ASP.NET | Thomson Reutershttp://theshravan.net@techieshravan
Building Single Page Apps for desktop, mobile, tablet with ASP.NET MVC 4
Agenda
What SPA & Why should you care?
Single Page Applications
Rich, responsive applicationscombining the best of web &
desktop, built with HTML 5 & JavaScript
Benefits
Great user experience
Runs on any device
Can work offline
Server Client
UIHTML/CSS
Application LayerJavaScript
Data Services
JSON/XML
Data Access LayerJavaScript
Navigation API
Web AppHTML/CSS/JS
Demo: Using Default SPA Project Template
Components of SPA
Data
UI
Web API
•Directly access and manipulate HTTP requests and responses in your Web APIs using a clean, strongly typed HTTP object model.
Modern HTTP programming model
Why Web APIs?
Build Richer AppsReach More Clients
Web API Growth
Source: www.programmableweb.com – current APIs: 4535
+ 100% + 50%+ 3400%+ 235%+ 71% + 86% + 46%+ 63%
GET /en/html/dummy.php?name=MyName&married=not+single &male=yes HTTP/1.1Host: www.explainth.atUser-Agent: Mozilla/5.0 (Windows;en-GB; rv:1.8.0.11) Gecko/20070312 Firefox/1.5.0.11Accept: text/xml,text/html;q=0.9,text/plain;q=0.8,image/png,*/*;q=0.5Accept-Language: en-gb,en;q=0.5Accept-Encoding: gzip,deflateAccept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.7Keep-Alive: 300Connection: keep-aliveReferer: http://www.explainth.at/en/misc/httpreq.shtml
Embrace HTTP
Flexible Hosting
Content negotiation
Query composition
Model binding and validation
Routing
FiltersImproved testability
IoC Support
Demo: Building a Web API
Demo: Calling a Web API from
JavaScript
Knockout.js
JavaScriptMVVM
Framework
What is MVVM?
Model -View -ViewModel
Why MVVM?
Why knockout.js?
Declarative Bindings
Automatic UI Refresh
Dependency Tracking
Templating
Referenceshttp://knockoutjs.com
http://blog.stevensanderson.com http://theshravan.net
Reach MeMy Blog : http://theshravan.netTwitter : techieshravan
Thank You