こんにちは。きんくまです。

CoffeeScriptというものがあります。

これはどういうものかといいますと、.coffeeファイルをJavaScriptへコンパイルするものです。

1. .coffeeという拡張子のファイルに、JavaScriptより簡潔な書き方で（ていうか独自）プログラムを書きます。
2. .coffeeファイルをJavaScriptファイルにコンパイル
3. この書き出されたJavaScriptファイルは普通のJSファイルなので手書きのものと変わらず、ブラウザで動く

CoffeeScriptのトップページに.coffeeファイルとコンパイル後のファイルが比較して載っているので、
参考にしてみるといいかもしれないです。

それで、今Canvasタグを練習していたのだけれど、CoffeeScriptで書いてみたくなったので、今回はそのインストール方法について書きますです。

—

ちょっと話を脱線するとCanvas2Dで3Dをやるのはjsdoitで検索をかけてみたらもう１年ぐらい前に盛り上がっていたみたいですね。こんな感じ。
>> 変体
>> HTML5で3D その6（ドーナツ）

これを自分でも作ってみたいなと思っているところです。
あとCanvas3Dの本命はWebGLになると思うので、こっちが終わったら、
そっちの方も今度やってみたいと思っています。
>> Learning WebGL
>> Learning Three.js

—

インストールの続き

CoffeeScriptのページを見ると、インストールにはNode.jsとnpmが必要と書いてあります。
>> Node.js
>> npm

Node.jsはブラウザの外で動かすJavaScript実行環境です。Chromeのv8エンジンで動いているみたいです。
npmはNode Package Managerの略で、Nodeを使ったツール（例えば今回のCoffeeScriptとか）をインストールときに依存関係のあるデータなどを自動で管理してくれるものです。これがあると、自分でライブラリを個別にインストールしたりしなくてもよいので楽になると思う。

で、さっきみたら、Node.jsのmac用のインストーラを使うとNode.jsとnpmがもれなくインストールされます。

インストールが終わったら、ターミナルを起動して、バージョンを確認すれば、
インストールされていることが確認できると思います。

node -v
npm -v

それぞれ私の環境tだと、v0.6.6と1.1.0-beta-4と出力されました。
これでCoffeeScriptのインストールの準備が整ったので、
ターミナルで次のコマンドを入力。

sudo npm install -g coffee-script

パスワードを入力するように求められるので、アカウントのパスワードを入力すれば
あとは、自動でCofeeScriptのインストールが完了します。

ターミナル上でこう入力すると

coffee -v

CoffeeScript version 1.1.3と出力されました。
試しに、コンパイルしてみます。

test.coffee という名前のファイルにこう書きます。

square = (x) -> x * x

そのファイルのあるディレクトリにターミナルで移動して、以下を入力します。
ディレクトリパスを入れるのが面倒なときは、ツールを使ったり、フォルダをそのままターミナルにドラッグドロップすると便利です。

cd ディレクトリパス
coffee -c test.coffee

うまくいくとtest.jsというファイルが出力されます。

test.js

(function() {
  var square;

  square = function(x) {
    return x * x;
  };

}).call(this);

それで、jsとかhtmlはAptanaを気に入っているので、こっちでやるときの豆知識。
（ターミナル上のemacsを使ってファイルを書いて、戻ってコンパイルというのは良さそうなのですが、個人的にはemacsが使いこなせないのです。でも、キーバインドはemacsにしている。）

Aptana画面左上の部分にターミナルボタンがあるので、それを押すと、ターミナルがAptanaの画面の中に表示されます。

そうすると、編集中のファイルのディレクトリをカレントにしたターミナルが立ち上がり、普通に使えるようになります。
だから、Aptana上で編集して、Aptanaの中のターミナルでコンパイルできると。
おー、便利。

今回のエントリはこのAptana内部のターミナル機能に萌えーっとしたので、書きました。

※追記
-wを使うと便利みたい。ファイルが保存された時点で、勝手にコンパイルしてくれるという。どうもです。
>> CoffeeScript マジ Coffee でかわいい – glasses factory

こんな感じに書く。

coffee -w -c test.coffee

そしたら、保存するたびに、自動でコンパイルしてくれちゃうよ。
やめたくなったらControl+cだよ。

Tweet

Pocket