Riverside Ruby presentation on coffeescript

1. CoffeeScript
Write javascript easier
Monday, January 24, 2011

2. Javascript
• Great language
• 60-70% of the code I write now is javascript
• Javascript is the future - especially with fast
browsers like Chrome
• Javascript is on the ugly side - braces and
brackets and semicolons lead to parse errors
Monday, January 24, 2011

3. CoffeeScript
• Cleans up Javascript
• Ruby-esque (designed to read like english)
and Python-esque (no ends, tab driven)
• Compiles to Javascript
Monday, January 24, 2011

4. Assignment
favorite_number = 314
is_a_programmer = true
# in javascript
var favorite_number = 314;
var is_a_programmer = true;
Monday, January 24, 2011

5. Conditions
if (favorite_number == 3.14)
is_a_programmer = true
else
is_a_programmer = false
alert(is_a_programmer)
# Conditions in javascript
if (favorite_number == 3.14) {
is_a_programmer = true;
} else {
is_a_programmer = false;
}
alert(is_a_programmer);
Monday, January 24, 2011

6. Functions
area_of_circle = (r) ->
3.14 * (r*r)
# in javascript
area_of_circle = function(r) {
return (3.14 * (r*r));
};
Monday, January 24, 2011

7. Other Stuff
• jQuery, Prototype, other frameworks - yes,
you can mix them in.
• Plugins - yes, you can mix them in.
Monday, January 24, 2011

8. Installation
• 1) Install node.js
• 2) Install npm (node package manager)
• 3) Install coffeescript
Monday, January 24, 2011

9. Install node.js
• mkdir ~/sources
• cd ~/sources
• wget http://nodejs.org/dist/node-v0.2.6.tar.gz
• sudo tar xvzf node[press tab]
• cd node[press tab]
• ./configure
• make
• sudo make install
Monday, January 24, 2011

10. Install npm
• cd ~/sources
• git clone http://github.com/isaacs/npm.git
• cd npm
• make
• sudo make install
Monday, January 24, 2011

11. Install coffeescript
• sudo npm install coffee-script
Monday, January 24, 2011

12. Try it out
• In terminal type: coffee
• You will get a command line interface
similar to irb.You can write coffee-script
directly from there if you wish.
Monday, January 24, 2011

13. Using with Rails/Sinatra/etc
• Use the barista gem - https://github.com/Sutto/
barista
• Add it to your gemfile
• rails generate barista: install
• edit config/initializers/barista_config.rb as necessary
• Now your coffeescripts will automatically compile
to javascript
Monday, January 24, 2011

14. Good practices
• Create a app/javascripts folder
• Put all your coffeescript in that folder - app/javascripts/
application.coffee
• Set config/initializers/barista_config.rb to compile to
public/javascripts/compiled
• Now all your generated javascript from coffeescript will
be in a compiled folder and you can still use normal
javascript when necessary under your public/javascripts
folder
Monday, January 24, 2011

15. Conclusion
• CoffeeScript is a more enjoyable way to
write javascript
• You will make less errors writing javascript
with CoffeeScript
• You will probably write more powerful and
more organized code too
Monday, January 24, 2011