Backbone.js+D3.jsでデータの可視化【準備編】

先週はnode.jsでニコ動のランキング情報をJSON取得するコードを書きましたが、
今回はそのデータを使って棒グラフを書くってところまでやります。
（d3.jsの事前知識は公式のチュートリアルを読んだくらいです。）

普通にd3.js使っても面白く無いので、Backbone.jsとRequireJS使ってやってみました。

ソースを全部上げるには大きくなってきたのでgithubに置いときました。
yussk/nicoranking2d3 · GitHub
※まだまだ未完成、なので準備編。

現状で出力されるグラフはこんな感じ。（マイリスの絶対数のグラフ）

しょぼい。

ニコ動のランキング情報をJSONで取得してみる

d3.jsで可視化したら面白そうなデータ無いかなーと思い、
ニコ動なら毎日データが変わって面白そうなのでAPIを調べてみました。

だいぶ汚いけどデータを持ってくるところまでは出来たので、
この次くらいに可視化します。
ということで今回はバックエンドでデータを集めるところまで。

半加算器と全加算器で足し算してみた【testem+mocha+chai】

訳あってJavaScriptでのビット演算について調べてたのでその経過を残しておきます。
もっと良いやり方があるに違いないけど、わからない。。

はじめに

やりたいことは、2つの数を足す関数を作ることです。
・・・そんなの簡単！、とはいかなくて、
算術演算子を使わないで頑張ります。
(算術演算子：+, -, *, /, %)

Browserifyの使い方について調べてみた

最近Browserifyって単語を良く見るようになりました。

Browserifyをざっくり説明すると、

• ブラウザ上でもNode.js用モジュールを使えるようにする
• ブラウザでもrequire()を使ったモジュール管理を使えるようにする

という特徴があるようです。

browser（ブラウザ）+ fy（〜する）という単語からもNode.jsをブラウザ化するってニュアンスでしょうか。

require()といえばRequireJSも提供してますよね。
Browserify使うことでRequireJSを使わなくてもモジュール管理ができるようになりそうです。

Backbone.jsに入門してみる【Router編】

久しぶりのBackbone.js入門。
Backbone.jsガイドブックを見ながらまとめてますが、
後半は試行錯誤のたまもの。

Backbone.Routerとは

Backbone.RouterはサーバーサイドMVCフレームワークでいうところのCにあたる部分、でもありますし、VCでもあります。
Backbone.ViewがDOMを監視するのに対して、Backbone.Routerはブラウザのハッシュ（URL欄）を監視します（厳密に言うとhashChangeイベントとpopStateイベントを監視）。
Backbone.Routerにハッシュとそれに対応する操作を設定しておくことで、
アプリケーション全体のコントローラみたいなふるまいをします。