Single Page Applications Rumesh Eranga University of Colombo School of Computing
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
Single Page Applications
Rumesh ErangaUniversity of Colombo School of Computing
A single-page application (SPA), also known as single-page interface (SPI), is a web application or web site that fits on a single web site with the goal of providing a more fluid user experience akin to a desktop application.
Wikipedia
What is SPA???
Great user experience (speed)
Runs on any device
Can work offline
App-store deployable
Any benefits?
Gmail http://www.hipmunk.com
Few Examples
Simple answer is NO
Single Page Applications are build using the combination of HTML, JavaScript, CSS
SPA == Rocket Science ????
Major JS Frameworks used in SPA
Visual Studio 2012
Asp.Net and Web Tools 2012.2 Update Can be installed using Microsoft Web Platform
Optional Templates
Requirements
Provides a foundation for SPA Development
Most of the templates are created by the community
Answers “How do I get started?”
SPA Templates
Sample/Bare bone Template
Lets develop our first SPA with a sample provided by the ASP team
Hello SPA Demo
Demonstration on how to create an SPA from Scratch
SPA from Scratch
Resources
Resources
Showing a view Navigate from page to page Load JS & HTML pages (on demand) Listen for app life cycle events
UI Requirements for SPA
View & View Model composition
Dynamically load modules
App Life Cycle (Activation & deactivation of screens)
Async programming with Promises
Convention based (Customizable)
Core Durandal.js features
Lets dive into a bare bone template where we can find many more functionalities of SPA
Using Hot Towel
CodeCamper by John Papa https://github.com/johnpapa/CodeCamper
Another Sample App
Search engine optimization Security vulnerability of breezejs/WebApi
http://stackoverflow.com/questions/13670948/isnt-it-dangerous-to-have-query-information-in-javascript-using-breezejs
http://stackoverflow.com/questions/13662496/how-is-breeze-js-handling-security-and-avoiding-exposing-business-logic
Downside of SPA
http://learn.knockoutjs.com/ http://learn.breezejs.com/ http://www.johnpapa.net/spa http://omegacoder.com/?p=986 http://www.asp.net/single-page-application http://singlepageappbook.com/
Learn More…
Email : [email protected]@gmail.com
Skype : rehrumesh
Slideshare : http://www.slideshare.net/rehrumesh
Skydrive : http://sdrv.ms/137ivjT
Q/A
Related Documents
