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.
Javascript MV*Bruno FélixSoftware Engineer @ White Road Softwarebruno.felix@whiteroad.pt@felix19350Why you should care
Topics• Why is client side MV* relevant• Libraries / Frameworks• Backbone.js in the wild
DisclaimerI don’t think Javascript is a bad language, but ithad a rough childhood (and some very stupiddesign decisions th...
The world’s most popular programming language05010015020025020/01/1120/02/1120/03/1120/04/1120/05/1120/06/1120/07/1120/08/...
We are expected to build enduring apps, thatprovide user experiences on par with nativeapps.That goes well beyond DOM mani...
Using only jQuery (for instance), it’s easy tocreate a mess of callbacks and selectors.
We need to focus on higher level concerns rightfrom the start:– Structure;– Persistence strategies;– Dependency management...
JS MV* frameworks offer a simple way toseparate concerns and provide much neededstructure to web apps.
We have a lot of choice, to name a few:You can view a comple list @ http://todomvc.com
Categorizing libraries/frameworksFlexibleBarebonesLow learning curveOpinionatedLots of features out-of-the boxHigher learn...
Backbone.js in the wildMajor wins:• Javascript templating decouples your JS codefrom the DOM specifics;• Code re-use to de...
Sure, you could do a large web-app using just aDOM manipulation library… or no libraries atall…
A Javascript MV* allows you and your team tobe more productive:– You don’t spend time re-inventing the wheel;– Helps estab...
An interesting side effect was that we startedlooking at our server side code more like an API:– We could re-use the exact...
ResourcesAbout Javascript:http://www.youtube.com/watch?v=v2ifWcnQs6M&list=PL5586336C26BDB324Linters are your friends (but ...
Noteworthy backbone plugins:Synapse (data binding – seems to have been discontinued):https://github.com/bruth/synapseValid...
Thanks!Bruno FélixSoftware Engineer @ White Road Softwarebruno.felix@whiteroad.pt@felix19350
Upcoming SlideShare
Loading in …5
×

Javascript mvc

648 views

Published on

A gentle introduction to javascript MVC frameworks, and what are the key drivers behind their popularity.

Published in: Technology
  • Be the first to comment

Javascript mvc

  1. 1. Javascript MV*Bruno FélixSoftware Engineer @ White Road Softwarebruno.felix@whiteroad.pt@felix19350Why you should care
  2. 2. Topics• Why is client side MV* relevant• Libraries / Frameworks• Backbone.js in the wild
  3. 3. DisclaimerI don’t think Javascript is a bad language, but ithad a rough childhood (and some very stupiddesign decisions thrown in the mix)
  4. 4. The world’s most popular programming language05010015020025020/01/1120/02/1120/03/1120/04/1120/05/1120/06/1120/07/1120/08/1120/09/1120/10/1120/11/1120/12/1120/01/1220/02/1220/03/1220/04/1220/05/1220/06/1220/07/1220/08/1220/09/1220/10/1220/11/1220/12/1220/01/1320/02/1320/03/1320/04/1320/05/13Average js size over time (kb)Source: http://httparchive.org
  5. 5. We are expected to build enduring apps, thatprovide user experiences on par with nativeapps.That goes well beyond DOM manipulation.
  6. 6. Using only jQuery (for instance), it’s easy tocreate a mess of callbacks and selectors.
  7. 7. We need to focus on higher level concerns rightfrom the start:– Structure;– Persistence strategies;– Dependency management;– Code re-use (DRY);– Testing;These types of frameworks help us do just that.
  8. 8. JS MV* frameworks offer a simple way toseparate concerns and provide much neededstructure to web apps.
  9. 9. We have a lot of choice, to name a few:You can view a comple list @ http://todomvc.com
  10. 10. Categorizing libraries/frameworksFlexibleBarebonesLow learning curveOpinionatedLots of features out-of-the boxHigher learning curve
  11. 11. Backbone.js in the wildMajor wins:• Javascript templating decouples your JS codefrom the DOM specifics;• Code re-use to deal with common patterns;• Overriding Backbone Sync, to tailor thepersistence strategies to your needs;
  12. 12. Sure, you could do a large web-app using just aDOM manipulation library… or no libraries atall…
  13. 13. A Javascript MV* allows you and your team tobe more productive:– You don’t spend time re-inventing the wheel;– Helps establishing a clear structure for yourproject.Allows you to integrate new people onto teameasily.
  14. 14. An interesting side effect was that we startedlooking at our server side code more like an API:– We could re-use the exact same API for a mobileapp, delivering it very rapidly;– At a “macro” level, it helps separate the concernseven further: server side stuff should just providea clean API, the web browser is a deliverymechanism, just like a mobile app or thecommand line.
  15. 15. ResourcesAbout Javascript:http://www.youtube.com/watch?v=v2ifWcnQs6M&list=PL5586336C26BDB324Linters are your friends (but they will hurt your feelings):– JS Lint: http://www.jslint.com/– JS Hint: http://www.jshint.comBackbone Fundamentals:https://github.com/addyosmani/backbone-fundamentalsA nice introduction to Angular Js:http://stephanebegaudeau.tumblr.com/post/48776908163/everything-you-need-to-understand-to-start-with
  16. 16. Noteworthy backbone plugins:Synapse (data binding – seems to have been discontinued):https://github.com/bruth/synapseValidation:https://github.com/thedersen/backbone.validationBackbone fetch cache:https://github.com/mrappleton/backbone-fetch-cacheMarionette:https://github.com/marionettejs/backbone.marionette
  17. 17. Thanks!Bruno FélixSoftware Engineer @ White Road Softwarebruno.felix@whiteroad.pt@felix19350

×