satococoa's blog

主にサーバーサイド、Web 系エンジニアのブログです。Go, Ruby, React, GCP, ...etc.

CoffeeScriptはじめの一歩

Rails勉強会@東京第63回のあまりのCoffeeScript人気に便乗して。

インストール

CoffeeScriptを動かす、あるいはJavaScriptコンパイルする方法も色々あるようですが、Node入れてやるのがいいと思うのでその方法で。
Node使う予定の無い人も、きっとそのうち一度はExpressやらSocket.ioやら使うときが来ます。

まずはNode(Node.js)を入れます。MacでHomebrewな人はおめでとうございます。簡単です。

$ brew install node

rubyでいうrvmみたいなものもあるのですが、僕はbrewで十分だと思っています。

引き続き、Node用のライブラリを管理するnpmを入れます。rubyでいうRubyGemsのようなものです。

$ curl http://npmjs.org/install.sh | sh

多分/usr/local/bin/以下にnpmが入ります。そのままcoffee-scriptを入れます。

$ npm install -g coffee-script

オプションの-gをお忘れなく。npmは、デフォルトではカレントディレクトリ以下にnode_modules/というディレクトリを作って、その中にライブラリを入れます。
今回はカレントではなくglobalにインストールするので、-gを付けます。これで/usr/local/bin/coffeeが入ったことと思います。

Hello World

hello_world.coffeeというファイル名で以下のようなスクリプトを作ってください。

console.log 'Hello, world'

jsにコンパイルし、nodeで動かしてみます。

$ coffee -c hello_world.coffee
$ node hello_world.js    # => Hello, world!

また、jsにコンパイルせずに直接動かすこともできます。

$ coffee hello_world.coffee    # => Hello, world!

.coffeeを更新したら自動的にjsにコンパイルする方法

その1 coffeeコマンドの-wオプションを使う。
$ coffee -wc hello_world.coffee  # これでファイルを監視開始
その2 watchrを使う。

参考:Haml+SCSS+CoffeeScriptでモダンな静的ページ制作を

その3 shadow.vimを使う。

参考:Vim-users.jp - Hack #192: 任意の言語で任意のマクロを使う

効率よくCoffeeScriptを勉強する方法

公式サイトを写経するといいと思います。
JavaScriptと違う書き方やキーワードも多くて、なかなか覚えられないですが一度写経してあとはひたすら書くといいのだと思います。

正直なところ、まだCoffeeScriptよりもJavaScriptを直接書く方が楽です。いちいち頭の中にあるjsのコードをCoffeeScriptに翻訳しながら書いている感じです。