Feb 23, 2012

Interactive CoffeeScript Books




If you own an iPad and enjoy the format of the interactive HTML book Smooth CoffeeScript, you might take a look at CoffeeScript: An Interactive Reference by Trevor Burnham. At just 15 pages, it is priced at $4.99. The thing that excites me is that it encourages you to code while you read.

In my mind, there is no good reason why every digital book on JavaScript programming should not be interactive. Typically, programming books make their example source code available for download, or somewhat better, cloning from GitHub. I usually do this and keep the code open in an editing environment while reading. When the code fragment I am studying is not too difficult to locate (mostly the case), as well as not too difficult to execute (sadly, not often the case), I love to do so, at a minimum just to see that it actually works. Often I go beyond just running the example and get into some experimentation, leading to much deeper learning. I do all of my technical reading on an 11" MacBook Air in order to lower the barrier to "coding along with the text" as much as possible.

For my upcoming book on Backbone.js and CoffeeScript, I am working on a subtle approach to interactivity that does not disrupt the flow of normal reading. Most readers say that they do not even notice at first that the code listings are embedded CoffeeScript editors. You can experience a prototype in this tutorial on helper functions with Eco (Embedded CoffeeScript templates). The current version of the format now uses wonderfully readable assertions from chai.js instead of browser alerts.

Please let me know what you think. Does interactivity in HTML books outweigh the disadvantages of reading in a browser? What do you think of iBooks? Any thoughts about executable JavaScript in PDF or other digital formats?

Feb 15, 2012

Backbone and Ember with Ashkenas and Katz

The team at the JavaScript Jabber podcast have really pulled together an amazing show this week, bringing Jeremy Ashkenas and Yehuda Katz together for a riveting live discussion of Backbone.js and Ember.js. This is a fantastic followup to the IRC discussion about Backbone and Ember that I covered on CoffeeScript Love a couple weeks ago.

In the 54-minute podcast, Katz talks at length about the design philosophy behind Ember, as well as the lessons he learned about convention over configuration while working on jQuery and Merb. He also talks about "the pipe dream" of using the same Mustache.js templates on both client and server. But don't assume it's just Katz lecturing (which I will listen to any day, by the way.) With Ashkenas and four other panelists on the line, the discourse is multi-sided, rapid, and forceful. Admittedly, there isn't much about CoffeeScript. But if you follow trends in JavaScript, these are the guys shaping the future, engaged in frank conversation. You shouldn't miss it.

Feb 9, 2012

Testing CoffeeScript with Mocha

Mocha is a flexible and feature-rich test framework for JavaScript created by the insanely prolific open-source developer TJ Holowaychuk. It's used to test some prominent projects in the Node.js ecosystem, including Connect and Express.

If you already have CoffeeScript installed (you do, don't you!? if not get it now), giving Mocha a try couldn't be easier. The clean, elegant look of nested callback functions in CoffeeScript, combined with Holowaychuk's awesome Should assertions, make CoffeeScript + Mocha the best-looking implementation of BDD that I have ever seen. Now, good looks aren't everything, but if they make you want to write a lot more tests, they can't be bad. (A word of caution: While Mocha works beautifully in the browser, Should does not, so for browser tests you'll need to use an alternate assertion library, such as Expect. Update: Chai provides an implementation of should assertions that works in the browser.)

Enough talk, let's look at a simple Mocha test in the BDD style.

describe 'Array', ->
  describe '#indexOf()', ->
    it 'should return -1 when not present', ->
      [1,2,3].indexOf(4).should.equal -1

Here is how to run the example:
  1. Install Mocha (globally for convenience): $ sudo npm install -g mocha should
  2. Copy the code above to array-test.coffee.
  3. $ mocha array-test.coffee --require should
As you can see, Mocha can compile and execute CoffeeScript directly when run in Node.js (browser usage requires compilation to JavaScript.) Even your production files can be in CoffeeScript. I created a simple mocha-coffeescript-boilerplate project on GitHub to illustrate this and get you started.

Coming soon on CoffeeScript Love: How to integrate Mocha browser tests with the Rails (>= 3.1) Asset Pipeline. Update: Read Testing CoffeeScript in Rails.

Feb 3, 2012

Backbone.js vs Ember.js

In the #documentcloud IRC channel on January 31, 2012, Jeremy Ashkenas (jashkenas) and Yehuda Katz (wycats) were asked by Travis Swicegood to contrast Backbone.js and Ember.js. (I have removed some IRC noise and unrelated conversations for clarity.)

09:56 tswicegood: so here's a loaded question since both of you are here...
09:56 tswicegood: what's the main differences between the backbone and ember?
09:56 tswicegood: I have some ideas, but I'm curious to hear from your perspectives :-)
09:58 wycats: tswicegood: Ember focuses heavily on bindings as the core abstraction, backbone focuses on raw events
09:58 wycats: Ember supports events
09:58 jashkenas: tswicegood: as with all of this stuff -- very different approaches to the same thing: building JS apps.
09:58 wycats: but Ember users tend to prefer bindings
09:58 wycats: jashkenas: does ^ seem correct?
09:58 jashkenas: eh, I think there's more than just that ;)
09:59 wycats: :p
09:59 jashkenas: from a user's perspective.
09:59 wycats: tswicegood: also, Ember's scope is larger -- for instance, we have a bundled template engine that is binding-aware
09:59 wycats: backbone is template-engine agnostic
...
10:01 jashkenas: tswicegood: but how to put it concisely ... Ember is an (IMO) more experimental attack at the end-to-end problem, by introducing new concepts to JavaScript, like the aforementioned Ember.meta bindings on objects ... Backbone is simply the lowest-common denominator set of functions and patterns to be productive.
This small discussion hardly scratches the surface in assessing either of these excellent JavaScript application frameworks. To make an informed decision about which to use in your own projects, you should: a) try them for yourself, b) read their source code, c) review their real-world adoption, and d) learn more about the philosophy and commitment of their core teams.

Update: Jeremy Ashkenas has published a much longer portion of the conversation about Backbone and Ember that continued on IRC. Also, the February 13, 2012 episode of JavaScript Jabber brought Ashkenas and Katz together for a live discussion on Backbone and Ember.