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 Return of JavaScriptThree Projects Driving JavaScripts Renaissance
What’s this about?
What’s this about? Why you should care about JavaScript
What’s this about? Why you should care about JavaScript 3 Open-Source JavaScript Projects:
What’s this about? Why you should care about JavaScript 3 Open-Source JavaScript Projects:
What’s this about? Why you should care about JavaScript 3 Open-Source JavaScript Projects:
What’s this about? Why you should care about JavaScript 3 Open-Source JavaScript Projects:
JavaScript             Me
Why JavaScript?
Single Page Apps
jQuery is not enough
Models and Collections var Booking = Backbone.Model.extend(); var Bookings = Backbone.Collection.extend({     model: Booki...
Viewsvar BookingsView = Backbone.View.extend({      initialize: function(){          _.bind(this, addAll, handleClick);   ...
Putting it all togethervar bookings = new Bookings();new BookingsView({el: $("#calendar"), collection: bookings}).render()...
What is Node?JavaScript outside the browserIO-focussedEvent-based
Node.js Architecture
var express = require(express);var sqlite = require(sqlite);var db = new sqlite.Database();...var app = express.createServ...
What Node is NotEasy as synchronous programmingFull-stack web frameworkA stable API
Why use CoffeeScript?ClassesScope and BindingEverything evaluates to something
JavaScript                           CoffeeScriptvar Booking =                    class Booking extends Backbone.Model  Ba...
JavaScript                               CoffeeScriptvar BookingsView =                      class BookingsView extends Ba...
List Comprehensions               positiveNumbers = [1, 2, 3, 4];               negativeNumbers = [];JavaScript     for (v...
Stockholm Syndrome
Let’s wrap this up Users demanding responsive apps JavaScript isn’t going anywhere New generation of tools Give JavaScript...
For more information...github.com/bent
Questions?
Applause
The Return of JavaScript: 3 Open-Source Projects that are driving JavaScript's renaissance
The Return of JavaScript: 3 Open-Source Projects that are driving JavaScript's renaissance
The Return of JavaScript: 3 Open-Source Projects that are driving JavaScript's renaissance
The Return of JavaScript: 3 Open-Source Projects that are driving JavaScript's renaissance
The Return of JavaScript: 3 Open-Source Projects that are driving JavaScript's renaissance
The Return of JavaScript: 3 Open-Source Projects that are driving JavaScript's renaissance
The Return of JavaScript: 3 Open-Source Projects that are driving JavaScript's renaissance
The Return of JavaScript: 3 Open-Source Projects that are driving JavaScript's renaissance
Upcoming SlideShare
Loading in …5
×

The Return of JavaScript: 3 Open-Source Projects that are driving JavaScript's renaissance

1,646 views

Published on

Web development is experiencing a major change at the moment. Users are demanding increasingly responsive and interactive web applications. The mobile web has taken off. And closed platforms like Flash are yielding to open standards like HTML 5.

In this presentation I’ll argue that the language that will underpin this revolution is JavaScript – despite it’s poor reputation. Furthermore, I’ll explain how JavaScript’s resurrection is being driven by a slew of new open-source technologies.

For video of this presentation, see http://www.youtube.com/watch?v=SiCD3Nbf810

Published in: Technology
  • Login to see the comments

The Return of JavaScript: 3 Open-Source Projects that are driving JavaScript's renaissance

  1. 1. The Return of JavaScriptThree Projects Driving JavaScripts Renaissance
  2. 2. What’s this about?
  3. 3. What’s this about? Why you should care about JavaScript
  4. 4. What’s this about? Why you should care about JavaScript 3 Open-Source JavaScript Projects:
  5. 5. What’s this about? Why you should care about JavaScript 3 Open-Source JavaScript Projects:
  6. 6. What’s this about? Why you should care about JavaScript 3 Open-Source JavaScript Projects:
  7. 7. What’s this about? Why you should care about JavaScript 3 Open-Source JavaScript Projects:
  8. 8. JavaScript Me
  9. 9. Why JavaScript?
  10. 10. Single Page Apps
  11. 11. jQuery is not enough
  12. 12. Models and Collections var Booking = Backbone.Model.extend(); var Bookings = Backbone.Collection.extend({ model: Booking, url: /bookings });
  13. 13. Viewsvar BookingsView = Backbone.View.extend({ initialize: function(){ _.bind(this, addAll, handleClick); this.collection.bind(reset, this.addAll); }, render: function() { this.el.fullCalendar({ eventClick: this.handleClick }); }, addAll: function() { this.el.fullCalendar(addEventSource, this.collection.toJSON()); }, handleClick: function(booking) { ... } });
  14. 14. Putting it all togethervar bookings = new Bookings();new BookingsView({el: $("#calendar"), collection: bookings}).render();bookings.fetch();
  15. 15. What is Node?JavaScript outside the browserIO-focussedEvent-based
  16. 16. Node.js Architecture
  17. 17. var express = require(express);var sqlite = require(sqlite);var db = new sqlite.Database();...var app = express.createServer();app.get(/bookings, function(req, res){ db.execute(SELECT * FROM bookings, function (error, rows) { if (error) { res.send(error.message, 500); } else { res.send(JSON.stringify(rows)); } });});app.listen(3001);
  18. 18. What Node is NotEasy as synchronous programmingFull-stack web frameworkA stable API
  19. 19. Why use CoffeeScript?ClassesScope and BindingEverything evaluates to something
  20. 20. JavaScript CoffeeScriptvar Booking = class Booking extends Backbone.Model Backbone.Model.extend();var Bookings = class Bookings extends Backbone.Collection Backbone.Collection.extend({ model: Booking model: Booking, url: /bookings url: /bookings});var bookings = new Bookings(); booking = new Bookings
  21. 21. JavaScript CoffeeScriptvar BookingsView = class BookingsView extends Backbone.View Backbone.View.extend({ initialize: function() { initialize: -> _.bind(this, addAll, @collection.bind reset, @addAll handleClick); this.collection.bind(reset, this.addAll); }, render: function() { render: => this.el.fullCalendar({ @el.fullCalendar eventClick: this.handleClick eventClick: @handleClick }); }, addAll: function() { addAll: => this.el.fullCalendar( @el.fullCalendar addEventSource, addEventSource, @collection.toJSON() this.collection.toJSON()); }, handleClick: function(booking) { handleClick: (booking) => ... ... } });
  22. 22. List Comprehensions positiveNumbers = [1, 2, 3, 4]; negativeNumbers = [];JavaScript for (var i = 0; i < positiveNumbers.length; i++) { negativeNumbers.push(-positiveNumbers[i]); }CoffeeScript negativeNumbers = (-num for num in [1, 2, 3, 4])
  23. 23. Stockholm Syndrome
  24. 24. Let’s wrap this up Users demanding responsive apps JavaScript isn’t going anywhere New generation of tools Give JavaScript a chance :)
  25. 25. For more information...github.com/bent
  26. 26. Questions?
  27. 27. Applause

×