Single page applications mit asp.net mvc und der asp.net web api
•Download as PPTX, PDF•
1 like•1,857 views
Recommended
More Related Content
What's hot
What's hot (13)
Viewers also liked
Viewers also liked (11)
Similar to Single page applications mit asp.net mvc und der asp.net web api
Similar to Single page applications mit asp.net mvc und der asp.net web api (20)
Recently uploaded
Recently uploaded (20)
Single page applications mit asp.net mvc und der asp.net web api
- 1. Single Page Applications mit ASP.NET MVC und der ASP.NET Web API Alexander Zeitler PDMLab http://pdmlab.com ddc_conference | #ddc12 www.dotnet-developer-conference.de
- 2. Single Page Applications • „Rich Client“ im Browser • Responsive • Best of both worlds • HTML 5 / JavaScript ddc_conference | #ddc12 www.dotnet-developer-conference.de
- 3. DEMO DEMO: Single Page Application in Aktion ddc_conference | #ddc12 www.dotnet-developer-conference.de
- 4. Single Page Applications • Angenehme User Experience • Auf allen Geräten verfügbar • Offline arbeiten möglich • via App Stores deployable ddc_conference | #ddc12 www.dotnet-developer-conference.de
- 5. SPA: Schema Server UI Client HTML/CSS Application Navigation JavaScript UI Data access Local Storage HTML/CSS/JS JavaScript Data JSON/XML ddc_conference | #ddc12 www.dotnet-developer-conference.de
- 6. SPA: Schema Server UI Client HTML/CSS Application Navigation JavaScript UI Data access Local Storage HTML/CSS/JS JavaScript Data JSON/XML ddc_conference | #ddc12 www.dotnet-developer-conference.de
- 7. DEMO DEMO: SPA Entwicklung ddc_conference | #ddc12 www.dotnet-developer-conference.de
- 8. KnockoutJS var Viewmodel = function() { this.title = ko.observable(‚Single Page Applications‘); this.tags = ko.observableArray([‚webapi‘, ‚knockoutjs‘, ‚spa‘]); } ko.applyBindings(new Viewmodel()) <h1 data-bind=„text: title“></h1> <ul data-bind=„foreach: tags“> <li data-bind=„text: $data“> </ul> ddc_conference | #ddc12 www.dotnet-developer-conference.de
- 9. HTML5 LocalStorage localStorage.setItem("key", “value"); localStorage.getItem("key"); localStorage.removeItem("key"); localStorage.clear(); navigator.onLine ddc_conference | #ddc12 www.dotnet-developer-conference.de
- 10. AMPLIFYJS amplify.store(„key“,“value“); amplify.store(„key“); LocalStorage SessionStorage GlobalStorage (FF2) UserData (IE) memory ddc_conference | #ddc12 www.dotnet-developer-conference.de
- 11. HTML5 CacheManifest <html manifest=“myapp.appcache"> ... </html> text/cache-manifest CACHE MANIFEST CACHE: NETWORK: FALLBACK: ddc_conference | #ddc12 www.dotnet-developer-conference.de
- 12. http://www.flickr.com/photos/crystaljingsr/391472934 3/ ddc_conference | #ddc12 www.dotnet-developer-conference.de
- 13. http://www.flickr.com/photos/nateone/3768979925 ddc_conference | #ddc12 www.dotnet-developer-conference.de
- 14. Alexander Zeitler PDMLab alexander.zeitler@pdmlab.com http://blog.alexonasp.net @AlexZeitler ddc_conference | #ddc12 www.dotnet-developer-conference.de