Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

The power of spa

810 views

Published on

Key Words: Motivations, considerations, real SPA samples and much more... :-)

Published in: Software
  • Be the first to comment

The power of spa

  1. 1. The Power of SPA Mónica Rodrigues https://github.com/monica85rodrigues/PGGD26 #PGGD26 – 23/04/2015
  2. 2. #PGGD26 2 Me? Since 2010 Mónica Rodrigues monica85rodrigues@gmail.com
  3. 3. 3 Contents • Challenge • Solution • Motivations • Considerations • SPA Samples • Demos • References #PGGD26
  4. 4. 4 Challenge #PGGD26 Users want a central place to view or take actions on most or all content so they don’t have to waste time navigating between pages.
  5. 5. 5 Solution Go to a SPA #PGGD26
  6. 6. 6 Solution #PGGD26 Use modern web development techniques to build a single-page app that doesn’t need to reload itself as the user browses through it. SPASingle Page Application
  7. 7. 7 Motivations #PGGD26 Reach Responsive Round Trip Web app may be accessible on different platforms and devices Web app needs to be very responsive to different screen resolutions Web app does not require many round trips between client and server The 3 Rs
  8. 8. 8 Motivations #PGGD26 Better user experience Separation of responsibilities between client and server Offline Web applications
  9. 9. 9 Considerations #PGGD26 The first time that the applications loads is slow Security What is the effort to make an offline application? It is possible?
  10. 10. 10 Multiple Page Application Page access Returns rendered page Page rendering #PGGD26
  11. 11. 11 SPA Requests data Returns data DOM processing and manipulation #PGGD26
  12. 12. 12 #PGGD26 Some Javascript Frameworks
  13. 13. 13 SPA Samples #PGGD26
  14. 14. 14 Demos #PGGD26
  15. 15. 15 References #PGGD26 • Angular VS Knockout [Online] http://blog.scottlogic.com/2014/07/30/spa-angular- knockout.html • Angular [Online] https://angularjs.org/ • Knockout.js [Online] http://knockoutjs.com/ • Backbone.js [Online] http://backbonejs.org/ • React [Online] https://facebook.github.io/react/ • Code School [Online] https://www.codeschool.com/
  16. 16. 16 #PGGD26
  17. 17. 17 Contacts #PGGD26 https://www.facebook.com/monica85rodrigues https://github.com/monica85rodrigues https://www.linkedin.com/in/monicascrodrigues @Monica85Rodrig

×