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.

Angularjs slides

448 views

Published on

Ploneconf 2015 - Developing Single Page Applications on Plone using AngularJS

Published in: Software
  • Login to see the comments

  • Be the first to like this

Angularjs slides

  1. 1. HI!  OLIMPIU ROB 4+ years experience with Plone ~1 year experience with AngularJS
  2. 2. DEVELOPING SINGLE PAGE APPLICATIONS ON PLONE USING AngularJS
  3. 3. SINGLE PAGE APPLICATIONS
  4. 4. SPA CHALLENGES DOM manipulation Browser History Routing Module and view loading Data binding Caching Input validation
  5. 5. JAVASCRIPT SOLUTIONS Ember.js ExtJS React Meteor AngularJS
  6. 6. FIRST DEMO
  7. 7. HOW IT WAS MADE
  8. 8. FILE STRUCTURE
  9. 9. INDEX.HTML JS:
  10. 10. ROUTES
  11. 11. FACTORY
  12. 12. CONTROLLERS
  13. 13. KITTENZ.HTML
  14. 14. DETAILS.HTML
  15. 15. ANGULARJS AND PLONE collective.js.angular Bower
  16. 16. A MORE USEFUL DEMO
  17. 17. PLONE INTEGRATION - Plone 5 productoli.areadme
  18. 18. VIEW CHAMELEON TEMPLATE INTEGRATING STATIC RESOURCES
  19. 19. VIEW CHAMELEON TEMPLATE INITIAL DATA
  20. 20. THE FACTORY
  21. 21. THE HEADING LISTING
  22. 22. HOW DOES ADDING A HEADING WORK? The template
  23. 23. HOW DOES ADDING A HEADING WORK? The function inside the controller
  24. 24. USING THE TINYMCE PATTERN THE TEMPLATE
  25. 25. USING THE TINYMCE PATTERN THE ANGULAR DIRECTIVE
  26. 26. ANGULARJS IN THE FUTURE
  27. 27. WHERE TO GO NEXT Angular documentation site: Code School's Shaping up with Angular.JS: Angular's github page: https://docs.angularjs.org/guide http://campus.codeschool.com/courses/shaping-up- with-angular-js/intro https://github.com/angular/angular.js
  28. 28. QUESTIONS?

×