Drupal Backbone.js in the Frontend

25
Backbone.js in the Front-end David Corbacho Román Ethan Winn

description

Slides for presentation at DrupalCon Munich August 2012 http://munich2012.drupal.org/program/sessions/backbonejs-frontend Author: David Corbacho http://corbacho.info

Transcript of Drupal Backbone.js in the Frontend

  • 1. Backbone.js in the Front-endDavid Corbacho Romn Ethan Winn

2. David Corbacho RomnC.S. EngineerDrupal & JavaScript specialistGoogle +1 module maintainerTwitter: @dcorbachoBlog: drupalmotion.com 3. Ethan WinnTechnical DirectorBackbone module maintainertwitter @eethann 4. The Future is a RESTful Drupal Dries Buytaerthttp://buytaert.net/the-future-is-a-restful-drupal 5. Levines Law: Start with the Demo 6. http://www.aberdeencloud.com 7. Web evolution Credit: Hjrtur Hilmarsson (@hjortureh) at 14islands.com 8. Write once, run everywhere 9. JavaScript is growing 10. JavaScript is getting fat Nov 2010 July 2012113 kB215 kBhttp://httparchive.org/trends.php 11. Help! 12. Its Time for Lasagna Code 13. BackboneBackbone.js gives structure to web applications byproviding models , collections andviews connecting all to your existing API over aRESTful JSON interface.Dependencies:underscore.js , jQueryAuthor:Jeremy AshkenasLicense: MIT 14. But.. jQuery is not enough?jQuery XHR [Ajax]ECMAScriptDOMBOMEvents 15. Backbone.js Decoupling data from DOM REST APIMODELVIEWholds raw data holds a HTML elementChange in dataEventsRender data 16. Backbone.js Vs Knockout.js Ember.jsAngularjsSpineBatman.js Sproutcore CappucinoJavascriptMVCCanJSSammy.jsKnockback Agility.js Stapes Fidel 17. Backbone.js Vs http://xkcd.com/927/ 18. Why Backbone.js is leading inJavaScript MVC frameworks? * the first * more resources and community * small 19. Backbone PhilosophyFocus in 1 thing. Minimalistic. 80% ruleAgnosticExpand it. Override it 20. 800 LOC 21. DontsDont use Backbone for small thingsDont use it if SEO is importantDont use it if you are in a rush.Dont CoffeeScript until you JavaScriptDont use extra add-ons on top of Backboneuntil you know Backbone.Dont learn it by theory: Its MV*. 22. Backend Vs FrontendDamn Backbone, you are taking toomuch control. Over my dead body! 23. The #ahah momentDrupal 6 : Lets program JavaScript with PHP Arrays,why not?Drupal 7: Ajax from PHP: more metaprogramming 24. Drupal 8Please dont.Embrace JavaScript,Let it be part of the Drupal wayThanks to Larry Gardfield & WSCCI Initiative 25. Thank youLink with extended slides : twitter @dcorbacho Ethan will continue now