Successfully reported this slideshow.
Your SlideShare is downloading. ×

The Beauty and the Beast - Modern Javascript Development with AngularJS and Plone

Ad
Ad
Ad
Ad
Ad
Ad
Ad
Ad
Ad
Ad
Loading in …3
×

Check these out next

1 of 33 Ad

The Beauty and the Beast - Modern Javascript Development with AngularJS and Plone

Download to read offline

Learn how a modern, full-featured Javascript front-end framework can play well with an enterprise-class content management system.

This talk will present how we build a flexible AngularJS front-end solution on top of Plone, with a state-of-the-art Javascript development workflow.

Learn how a modern, full-featured Javascript front-end framework can play well with an enterprise-class content management system.

This talk will present how we build a flexible AngularJS front-end solution on top of Plone, with a state-of-the-art Javascript development workflow.

Advertisement
Advertisement

More Related Content

Similar to The Beauty and the Beast - Modern Javascript Development with AngularJS and Plone (20)

More from Timo Stollenwerk (20)

Advertisement

The Beauty and the Beast - Modern Javascript Development with AngularJS and Plone

  1. 1. The Beauty and the Beast Modern Javascript Development with AngularJS and Plone Timo Stollenwerk Plone Conference 2014 — Bristol
  2. 2. The State of Javascript in Plone
  3. 3. Problems
  4. 4. Requirements
  5. 5. Modern Javascript Solutions
  6. 6. Angular JS
  7. 7. 1200 900 600 300 0 Contributors Angular Backbone Ember Knockout React
  8. 8. 20 15 10 5 0 Books Angular Backbone Ember Knockout React
  9. 9. 300 225 150 75 0 Meetups Angular Backbone Ember Knockout React
  10. 10. Google Trends
  11. 11. „We're not building a new language, just making what we already have better“ ! — @mhevery
  12. 12. def persons(self): return [ {'title': 'John Doe'}, {'title': 'Jane Doe'} Zope Browser View ]
  13. 13. <ul> <li tal:repeat="person view/persons"> <span tal:replace="person['title'}"/> </li> </ul> Zope Page Template
  14. 14. $scope.persons = [ {'title': 'John Doe'}, {'title': 'Jane Doe'} ] Angular Model / Controller
  15. 15. <ul> <li ng-repeat="person in persons"> {{person.title}} </li> </ul> Angular Template
  16. 16. <ul> <li tal:repeat="person view/persons"> <span tal:replace="person['title'}"/> </li> </ul> Zope Page Template
  17. 17. <input type="text" ng-model="yourName"> ! <h1>Hello {{yourName}}!</h1> Angular Templates
  18. 18. Two Way Binding
  19. 19. Two Way Binding <input type="text" ng-model="yourName" placeholder="Your name here"> ! <h1>Hello {{yourName}}!</h1>
  20. 20. ! <portlet-navigation start-level="1" tree-depth="2" /> Angular Directives
  21. 21. myApp.controller('MyUsers', function(getUsersService) { /* Do something with myUserService */ $scope.users = getUsersService(); } ); Dependency Injection
  22. 22. Demo
  23. 23. Modern Javascript Development
  24. 24. The Future of Plone?
  25. 25. The Future of Plone? github.com/tisto/plone.app.angularjs
  26. 26. RESTful JSON API
  27. 27. Reasons not to use Javascript
  28. 28. Conclusion
  29. 29. The Beauty and the Beast Modern Javascript Development with AngularJS and Plone Timo Stollenwerk http://timostollenwerk.net tisto@plone.org irc: tisto Plone Conference 2014 — Bristol ! github.com/tisto/plone.app.angularjs

×