１週間ほど試してみてたところ、気に入ったポイントは

1. 2バイトサポート
2. 起動時間が速い
3. Pythonで拡張機能をかける

ソースコードの中に日本語を入れることがあるので、1. は重要な点です。
TextMateはここが弱かったので、普通に入出力ができるSublimeは良い点でした。

カスタマイズが好きな私にとって、3は魅力的な点です。
でも、まだやり方がわからないので、時間ができたら調べてみようと思います。

JavaScriptをまた勉強しています。今回はだらだら日記です。

json_parser

この間本を買いました。
>> JavaScript: The Good Parts

そんで、この本の巻末にjsonのパーサーが載っていました。
調べてみたら、githubにあがってるやつでした。

>> douglascrockford / JSON-js

パーサーっていうのは、文字列を解析するものためのものです。
そんで、興味があったので、どうやってやっているのか、調べてました。

本にのってたのは、このページのやつでした。

これは、コードとしても短いので、みやすかったです。
コードが長くなっちゃうと、今見ているのが何をしているのか、わからなくなっちゃうのだけど、これは、そんなことがなかったです。
最後のところが何しているのかわからなかったけど、文字を1文字ずつ読み込んでいって、それが何を表すか評価をしていっていることがよくわかりました。
コードみただけじゃわかんなかったので、console.logさしこんで確認していったのですけどね、、。
前に、syntaxhighlighterみたいのって作ってみたいなーと思ったことがあったのだけど、どうやっていいのかわからなかったのですが、こうやって解析していけば、できそうな気がします。

node.js

前にCoffeeScriptを試したくて、入れたnode.jsでしたが、チュートリアルの動画をみていたら、nodeそのものに興味がわいてきました。

チュートリアルの動画
Homepage – Node Tuts – Node.js Free screencast tutorials

EPISODE 8ぐらいまでみたところ。
スクリーンキャプチャしながらコメントしているので、タイプミスやコードエラーもよくあるのだけれど、それをすぐに直してるところが、なんかリアルっていうか。楽しい感じです。

TextMateを使っているようなので、私も真似して体験版を使ってみました。
そしたら、なんかよさそうだったので、購入しました。
Aptanaの方が高機能なのだけど、TextMateは軽いのでよし。
前のバージョンでは2バイトがうまく表示できなかったみたいだけど、TextMate2が出ていて、そっちはうまく表示できているので、よし。
でも、表示はよいのだけど、日本語入力がうまくいかないのです。Ctrl+mでないと確定できないので、これで長文はかけないという、、。
バグというかそのことを開発元に伝えたいのだけど、どこに書けば良いのだろう？

>> TextMate 2 がやってきた | イナヅマtvログ

それで、node.jsのチュートリアルページも一通りやってみました。

チュートリアルのページ
The Node Beginner Book

チュートリアルのページをやると、どうやって他のjsを読み込んだりするかっていう基本的なことがわかります。

node.jsの何に興味をひかれたかというと、サーバーが簡単に作れるというところです。
httpサーバー、socketサーバー、websocketサーバー。
socketサーバーができるということは、flashとも簡単に通信ができるんです。
websocketのサーバーをたてれば、jsともソケット通信ができるという。

そんで、websocketについて調べてました。
まだ仕様は確定していないので、各ブラウザによって使っている仕様のバージョンが違います。

このページがよくわかりやすいです。
>> Jettyで始めるWebSocket超入門

仕様書をもとに、自分でサーバー側を書いてみようと思いました。（クライアント側のJavaScriptはわりと簡単。ブラウザが難しいところやってくれるからね！ ）

現在のChrome（16.0.912.75）の仕様書はこれ（iOSのsafariはまた違うバージョンで互換性なし！）
The WebSocket protocol draft-ietf-hybi-thewebsocketprotocol-13

仕様書にはプロトコルが書かれています。
プロトコルっていうのは、通信の手順のとりきめですね。
電話のかけかただったら、受話器をとってから番号を押すみたいな、そういう手順です。

Websocketのこれには２つの段階があります。
1. ハンドシェイク（握手。接続を確立するまで）
2. 実際のデータの送受信（フレームと言われる単位で行う）

そんで、wiki見ながらハンドシェイクまでは自力で実装できたのだけど、データの送受信がどうやってやるのかわからず。
チュートリアル動画にもあったSocket.ioのソースコードを見てみることに。

最初は何をやっているのかわからなかったのですが、ビット演算をしているらしい。
ビット演算子

フレーム構造はこうやって書かれています。

>>http://tools.ietf.org/html/draft-ietf-hybi-thewebsocketprotocol-13#section-5.2

      0                   1                   2                   3
      0 1 2 3 4 5 6 7 8 9 0 1 2 3 4 5 6 7 8 9 0 1 2 3 4 5 6 7 8 9 0 1
     +-+-+-+-+-------+-+-------------+-------------------------------+
     |F|R|R|R| opcode|M| Payload len |    Extended payload length    |
     |I|S|S|S|  (4)  |A|     (7)     |             (16/63)           |
     |N|V|V|V|       |S|             |   (if payload len==126/127)   |
     | |1|2|3|       |K|             |                               |
     +-+-+-+-+-------+-+-------------+ - - - - - - - - - - - - - - - +
     |     Extended payload length continued, if payload len == 127  |
     + - - - - - - - - - - - - - - - +-------------------------------+
     |                               |Masking-key, if MASK set to 1  |
     +-------------------------------+-------------------------------+
     | Masking-key (continued)       |          Payload Data         |
     +-------------------------------- - - - - - - - - - - - - - - - +
     :                     Payload Data continued ...                :
     + - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - +
     |                     Payload Data continued ...                |
     +---------------------------------------------------------------+

node.jsのBufferクラスの最小単位は8bit（Octetというらしい）なので、ビット単位のデータを検証したり、埋め込んだりするには、ビット演算が必要になるんですね。
それがわかってしまえば、結構楽しいです。

例えばopcodeという、これからくるデータが何を表すのかがあります。
それを抜き出すには、下位4ビットが必要なので、

opcode = buffer[0] & 0xf

としてあげるとよいです。

データがマスクされているかを示すMASKを取り出すには、

masked = buffer[1] & 0x80

となります。ビット演算やってたら「おお、俺いまプログラマっぽいことしてる！」という、俺イメージの中のプログラマの像に重なってうれしくなりました。

Chromeとはなんとか通信できるようになったのですが、iOSとつなぐのはまた調べないといけないことが多いので、素直にSocket.io使おうかどうか迷うところ。使った方が断然簡単なのだけど、構造を勉強しながら作ると大変な分、得るものが多いので悩みどころですね。

それで、話かわりまして、宣伝といいますか、
今度f-siteでしゃべる機会を得ましたので、この辺をからめて発表してみようと思っています。
お題はjsflなのですけど、無理矢理からめちゃえと。ちなみにdemo2です。

あと、またまた全然話し変わって。
flashとhtml5って比較が出てくるのですけど、最近思うのは、flashというよりはAIRとhtml5って言う方がしっくりくるんじゃないかということです。
描画の速度はもちろんflashの方が上だったり、音声・動画関係のバツグンの安定感もflashが上なのですが、ファイルの保存とか今回のソケットだとか、DBとか含めて考えると、flashっていうより、AIRかと。

あと、いくつかJSのライブラリを見ていると、実は裏で代替機能としてflash使っているものって結構あるのですよね。Socket.ioもそうなんですよ。

自分は別にflashでもhtml5でもどっちの肩をもつつもりもないのですけど、ブラウザネイティブに機能が追加されてきているのは、面白い動きだと思います。
ただ、クロスブラウザを考えると実案件は当分先になるでしょうね。
でもでもiOSやandroidにしぼった形ならかなり近そうです。

今はnodeとJavaScriptそのものをもう少しやってみたいので、しばらく続けたいなと思ってます。

自分の性格的に、ストイックに「emacsだけ」とか、「ターミナルだけ」とかできないので、
その時の便利具合に応じて使い分けてる。

あとターミナルじゃなくFinder上で
Cmd + Shift + .(period) で隠しファイルの表示/非表示のきりかえ

でも、やっぱり今のところFinder上が慣れてるし楽だ。
ただ、echo hoge > hoge.txt とかやるとエディタアプリとか立ち上げずに
すぐにテキストファイルが作れたりするのは、魅力だと思われ。

このコマンド一覧は、下記の本を参考に作りました。
>> Mac OS X v 10.5 Leopard as UNIX

ずーっと何年も前にふと興味があったので買ってから、少し読んでは寝かせて。みたいな感じだったけど、ざっと読んでみました。
この本の途中に、unixのアプリをmacで使うという章があって。
tar.gzファイルを拾ってきて、それを自分でコンパイルして、インストールという流れが書いてありました。
全く知らないことだったので、１回やってみたら勉強になった。
以前に、openCVをやってみようと思って、この流れが全くわからなかったので、挫折しちゃったのだけど、
今度はできそうな気がする。

unixのアプリを動かそうと思うと、端末の種類（CPUとか）やOSに依存することがあります。
「別の機種でソースコードからコンパイルされたバイナリ」を動かそうとしても他の端末では動かないことがあるのです。
なので、コンパイルする生のソースコードを拾ってきて、機種ごとにコンパイルをする方が確実。
そのコンパイル時の設定は機種ごとに変更する必要があるので、そのあたりを自動化する仕組みがある。

でも、このあたりは最近はHomebrewっていうので、管理するのが流行ってるみたい。
これは、何をするものかというとさきほどの機種依存をmac用に考慮してくれて、ソフトを管理してくれるアプリです。
「自分でソースコード拾ってきてコンパイル」とかしないでも、有名どころはコマンドひとつでインストールしてくれちゃうやつです。

ちょっと前はこの本にも書いてあったMacPortsが流行ってたみたい。
macportsとhomebrewとか検索すると結構出てくる

そんなわけで、前にnodeとCoffeeScriptをそのまま入れていたのだけど、Homebrewで入れ直してみた。

emacsはコードを書くなどメインで使用する気はないのだけれど、
メモ書きとか、設定ファイルとか、ちょっとした書き足しor修正するのを
ターミナルだけでかけるのは、便利だなと思ってきたところ。

下のコマンド一覧にC-p,C-aとかのカーソル移動は、自分的にKeyRemap4MacBookとか使って覚えていたことなので、載せてません。
KeyRemap4MacBookはすごく便利なアプリで、emacsのカーソル移動をeclipseとか他のアプリでもすることができるのです。
（あーでも、それ機能のうちのごく一部です。メインは普通にキーバインドをいじれるという趣旨のソフトです）
だから、AptanaとかFlashBuilderとかでもemacsのキーバインドで動くと。もちろん普通のエディタCotEditorとかでもです。
前に、FlashBuilderでショートカット設定からemacsのキーバインド設定にしたときに、なんかうまくいかないことがあったのだけど、これなら大丈夫。

emacsのキーバインドって何か知らない人のために説明すると、
Control+nとか、Control+aとかで、カーソルを次の文字とか前の文字へとか、行頭、行末へとかいろいろと移動できるのです。
これに慣れると、矢印キーを押さなくてもよいので、全く手首のポジションを変えることなく、コーディングをすることができるという。
慣れると文字を書くのがむちゃくちゃ速くなるのです。
自分的には、シャアが通常のザクの３倍の性能を引き出すみたいな感じだと思ってます。

そんで、私は前にWindowsを使っていたのですけど、そのときは、にとしょーとを使ってました。にとよんさん作のアプリでものすごくお世話になりました。本当ありがとうございます。冗談抜きに、ご飯ぐらいごちそうしないと罰が当たると実は思ってたり。お会いしたことないけど。
これに、Controlの部分をaltに変えたキーバインド設定ファイルを使ってました。そんで、altキーだと親指がつりそうになるので、レジストリをいじって無変換キーをaltキーに変更してやってました。

他にも下のようなものがあったのだけど、ちょっと使い始めてるときにmacに移っちゃったので、こちらの使用感はあまりわからないです。
[Windows] WindowsでEmacsのキーバインドが実行できるXkeymacs

今年ももうすぐ紅白が始まる時間となりました。

今年もいろいろとありました。

iPadやAndroidのタブレットのアプリを作ったり、
都内在住の外国人からアポがあって、仕事を手伝ったり、
プログラムの言語もいろいろとやる機会があり、とても勉強になりました。

英語の勉強は、もうすぐ丸２年くらい。何事も続かない私の割には、珍しく続いています。
学生のときは苦手科目で、30過ぎてから始めたけど、なんとかなるもんです。
欲をいえば、20代にやってれば良かったと思いますが、必要に迫られたのが、30過ぎなんだから仕方ないですね。
海外っていうかシリコンバレーで働けたら、楽しいだろうなと思って、調べてみたこともあるけど、１人でならともかく、家族もいるし、なかなか難しいですね。

カタコトながら、ブログも続いていて、1対1で少しだけなら話をすることができるようになりました。
各種本家の英語ドキュメントも、コードがあるから、なんとなくこんなこと言ってるんだろうなー。という感じでなら読めるので、プログラムする上ではすごく役に立っています。

ただ、ネイティブ同士の会話は全く聞き取れないし、長文読んだりすることや、ちゃんとした会話はまだできないです。
１度、都内のネイティブていうか、英語が話せる人たち（ほとんど外国人）の勉強会に行ったのですが、全然ダメでした。頭が真っ白になるっていうか、全然聞き取れないし、あわあわしちゃって、懇親会にも出ずに、すぐに帰ってきてしまった、、。あれは本当にくやしかったです！
なんとかしてあそこにもう一度行きたいなと。
日本の勉強会は、講義形式というか、スピーカーがいてその人の話を聞くというのがメインだと思うのですが、あっちのは、ディスカッションがメインだったので、知らないでいったら、そういう結果に。
なので、少しずつ上達していけたらいいなと思います。

ブログの記事は、来年も自分がつまったところや、勉強したことをまとめたりすることを続けたいと思います。
意外と他の人に役に立ってたりするみたいです。良かった良かった。
読んでもらって、どうもありがとうございます。

あと、Twitter上でRTしてもらったりしても、何にもコメント返さない失礼な奴だったりするんですが、そういう奴だと思ってください。
本当すんませんです。それからありがとうございます。

では来年もよろしくお願いします。

jQuery
Backbone.js MVC
CoffeeScript
Node.js
NowJS
jsdom
Socket.io

このページのコメントから。

2011/01/03 追加
新春特別企画：2012年のJavaScript～PCからモバイルの時代へ｜gihyo.jp … 技術評論社
pjax ajaxでページロード
zepto.js 軽量ライブラリ

–
impress.js プレゼンツール 3dとかできて面白い

1. １枚のファルだけを圧縮

zip example.zip filename

2. ディレクトリを圧縮 -rオプションをつけます

zip -r example.zip directoryname

3. パスワードをつけてディレクトリを圧縮 -Pオプションをつけます

zip -P yourpassword -r example.zip directoryname

もうすぐ今年も終わりですね。
さて、先日ブログにこんなメモを残しました。

>> [terminal] ターミナルで.DS_Storeファイルを再帰的に消す

そんで、やっちゃいましたよ。
作業中に、ふーっと、まとまりのいいところまできたので、gitでコミット。
あるフォルダの.DS_Storeファイルを消そうと思って、コマンド打ったんですよ。
そしたら、ですね、なんかおかしいんですよ。
あれ？？？？
なんか全部ファイルが消えてるんですけど…。

コマンド打ったディレクトリ以下が空のフォルダ残して全部消えちゃってます。
すごく焦ったんですよ。
それで、
「いや、なんの、gitで回復させれば大丈夫だっつーの。」
とか青くなりながら、gitコマンドうったら、
「gitのリポジトリなんかないよ。」
とかメッセージが帰ってきたんですよ。

いやいやそんなことないって、とかいって、見てみたら、リポジトリごとごっそり
消去してしまっていたという、、。

コマンドもう一度ちゃんとみたところ、rmのオプションの-nameが抜けていて、
名前で検索せずに、何もかも削除ということをしてしまっていたようです。

ターミナル上で、ファイルを削除するとゴミ箱行かないで、いきなり削除されちゃうんで、
もとに戻せないという。

いやー焦りました。
そしたら、TimeMachineが俺にはあるじゃマイカと、TimeMachineのデータが入っている外付けHDDをつないでみたところ、2日前にたまたまバックアップしていたのを発見。
普段、１ヶ月に１度やるかやらないかの、きまぐれバックアップだったのですが、
何故かそのときは気が向いてやっていたという。
なので、2日前までは戻れるということになりました。
はじめてTimeMachine使いましたよ。助かりました。

いつもは、こういう置換削除みたいな、ヒヤリ系は必ずどこかに一度バックアップコピーしてから作業しているんですが、gitのリポジトリあるからいいやとか、ターミナルも少し慣れてきたかな、みたいな気のゆるみがあり、全くしていませんでした。

作業的には、実際のところ半日分くらいのところだったので、そこまで大事にはいたらなかったのですが、なんだか自分の気のゆるみを指摘された気分になりましたよ。

対策としては、以下の感じにしようかと。

1) TimeMachineのHDDつけっぱなし＋スイッチON状態にしておいて、絶対に1時間前に戻れるようにしておく
2) rmコマンド打つときは慎重に。-iオプションつけて、プロンプト出させたり、再帰処理の時は絶対にバックアップをとってから行う
3) gitのリポジトリのあるディレクトリではterminalの作業は行わないようにする。gitリポジトリ以下の階層でもgitコマンドは使える（というのを今回知った）

@-webkit-keyframes flapping {
   0% {
   	-webkit-transform:scale(0,0);
   	opacity:1;
   }
   100% {
   	-webkit-transform:scale(1,1);
   	opacity:0;
   }
}

でも、iPadでスクロールさせたときに、CSS3 アニメーションが止まってしまい、困ってしまいました。
正確に言うと、0%のキーフレームの位置からそれ以上進まなくなってしまうのです。

ググったところ、こんな感じのページを発見。

>> GPUアクセラレーターが使える環境で強制的に有効にできるCSSの指定方法

CPUからGPUのレンダリングの切り替えのタイミングでsafariがちらつくとのこと。
最初からGPUレンダリングを使えば、そんなことなくなるよ。
これをするために、こんなCSSプロパティを使えばいいみたい。

-webkit-transform-style: preserve-3d;

そしたら、うまいこと解決してくれました。
助かりました。どうもです。

たぶん予想するに、スクロールするときにその切り替えのタイミングが起こっていたのかもしれませんね。

z-sortがうまくいっていないのですが、ドーナツを表示することができました。
3Dドーナツは別名トーラスというそうです。
点の取り方は、中心から離れたところに円を描いて、それをぐるっと１周させるとできました。
行列使って、回転させるとできましたです。

あとすごいドーナツを見つけたので、載せておきます。
途中からレンダリングが次々と切り替わっていくので重くなりますが、面白いです。
>> http://raksy.dyndns.org/torus.html

それで、今回は1から書いてみてるのですが、なかなか勉強になります。
行列、内積、外積とか。
以前にやったときは急ぎ足でやっていたので、あんまり理解していなかったのですが、
今回はわりと考えながらやっているので、得るものがありました。

あと面白いと思うのは、直線で点をつなげて塗りつぶせれば3Dでも描画できるということです。

もう少しやってみようと思います。