2011年1月アーカイブ

最近、まわりでCoffeeScriptがすごいという声が。

CoffeeScriptって？

Javascriptを洗練させてPythonやRubyライクな文法で書ける言語。
コンパイルするとクロスブラウザでJS Lintも通るJavascriptになるというもの。
某WebベースのTwitterクライアントも、JS部分はこれで書いてるとか。

CoffeeScript - sappari wiki
https://sites.google.com/site/sappariwiki/coffeescript

CoffeeScriptについては、日本語だと、ここがよくまとまってます。

さっそく、CoffeeScritptを入れて、Titaniumの最初のコード(プロジェクトを新規作成するとできるやつ)をCoffeeScriptで書きなおしました。

https://gist.github.com/764343

JSファイルにコンパイルして、Titaniumでビルド。ドキドキ。
ちゃんと動きました！ かなりすっきり書ける印象。

で、CoffeeScriptのコンパイルを前回のTitaniumのビルドを簡単にするスクリプトに組み込んでみる。

https://gist.github.com/767905

これでスクリプトを叩けば、自動的にCoffeeScriptがコンパイルされて、iPhoneアプリがビルドされる。

CoffeeScript -> JavaScript -> (Titanium) -> ObjectiveC

というすごい階層構造に。
CoffeeScriptで書いてて、たまに生成されたJSを見るとJavascriptが低レイヤーのアセンブラのように思えますｗ

クラス化してみる

Titanium公式のカプセル化は若干使いにくいので、どうしようかなぁと思ってたのですが、CoffeeScriptはクラスも使えるらしい。

https://gist.github.com/767545

さきほどのサンプルコードをクラスを使って書き直してみました。
ちょっと冗長かもしれないけど。。
まだ理解が浅いですが充分使えますね。

個人的には、thisをクロージャーやイベントリスナーに渡せるFunction bindingがあるのが便利。
functionを書かなくていいのも。これでタイポから解放される？

https://gist.github.com/767613

実際にコンパイルで生成されたJSはこんな感じ。

変数は最初にまとめて定義されていて、bindやfor ~ of などに使われる関数も定義されてます。
jQueryなどのライブラリを読み込むのと違って、必要なコードしか生成されないので、パフォーマンス的にもよさそう。
クラスはJSのprototypeベースのクラス化をわかりやすく使えるというかんじ。

ということで、CoffeeScriptかなりいいかも。

各エディタ向けの入力支援ツール

defunkt/coffee-mode - GitHub
https://github.com/defunkt/coffee-modeemacs
emacs使いの人はここ。

kchmck/vim-coffee-script - GitHub
https://github.com/kchmck/vim-coffee-script
Vim使いの人はここ。

jashkenas/coffee-script-tmbundle - GitHub
https://github.com/jashkenas/coffee-script-tmbundle
最近、Macに乗り換えてTextMate使いになったので、これを入れた。

Vim-users.jp - Hack #164: JavaScript開発環境 その2 CoffeeScriptを使う
http://vim-users.jp/2010/07/hack164/

非常にマニアックな考察がされていますw
今回の記事は、UjihisaくんからCoffeeScriptすごいよ！と教えてもらったのがきっかけで書きました。

Thanks. Ujihisa!

そろそろiPhoneアプリに手を出そうということで、最近、話題になっているTitaniumを使って、JavascriptでiPhoneアプリを作ってみています。

titanium-mobile-doc-ja - Project Hosting on Google
http://code.google.com/p/titanium-mobile-doc-ja/

日本のTitaniumの情報はここが詳しい。

http://tidocs.com/mobile/latest/

リファレンスは↑が公式より探しやすくてGood

ただ、しばらく開発してみると、毎回Titanium Developerからビルドするのが面倒。
JS開発におけるオートリロードみたいな方法はないものか？

TitaniumのコードをGUIなしでエディタからすばやくbuildする - はこべにっき
http://d.hatena.ne.jp/hakobe932/20101125/1290694032

あったー。hakobe++

ただ、CPANをインストールしてライブラリを入れないといけないのがperl使いじゃない人には若干面倒。

そこで、なにも入れなくてもいいRubyで書き直してみました。

• https://gist.github.com/764505

使い方はまったく同じ。

Titaniumのプロジェクトフォルダにbuild.rbを置いて、ターミナルから

ruby build.rb

サーバーが立ち上がるので、http://127.0.0.1:9090/run を叩けば、buildが始まります。
ターミナル上でログを見ることができます。

Ruby初心者なので、わりと適当だと思います。
Macで動作確認してます。Windowsで動かすには若干変更が必要かも。

エディタから呼び出す方法は、それぞれやり方があると思うのですが

キーボードで呼び出せてどのエディタでも使える方法。

Automator->"アプリケーション"->"シェルスクリプトを実行"->"curl http://127.0.0.1:9090/run"

でアプリを作って、"rebuild_titanium"などと名前を付けて保存。Spotlightで呼び出して実行するだけ。
キーボードだけで操作できて快適になります。

Spotlightのショートカットは個人的には使いにくいので、LaunchBarをCommand+Spaceで呼び出すようにしています。
LaunchBar、慣れれば使いやすいのでオススメです。