slowjet

is a part of a carburetor

複数人で開発するときに揃えたほうがいいところ: イベントの命名規則

イベントドリブンな持ち回しだと、よくあるイベント名を使いがち。例えば、クリックされたっていうのから、コントローラーとかへ渡す場合

// view
_onClick: function(ev) {
  this.someController.trigger('click', @);
}

// controller
_eventify: function() {
  this.listenTo(someView, 'click', function() {
    // hogefugapiyo
  }
}

みたいなの。例えば後から違う人がViewのコードを見て、clickだけで検索すると、、clickって他でもよく使ってるから検索結果に出てくるよね…イベント名は固有で分かりやすい命名規則にしておくと、メンテナンスがしやすそう。

// view
_onClick: function(ev) {
  this.someController.trigger('clickSomeView', @);
}

// controller
_eventify: function() {
  this.listenTo(someView, 'clickSomeView', function() {
    // hogefugapiyo
  }
}

イベント名にコロン使うとかドット使うみたいな話はまたどこかで。

複数人で開発するときに揃えたほうがいいところ: コメントを出来る限り書く

コメントは出来るだけ、分かりやすく書いたほうがいい

コードを読めば分かるけど、あっちへいったりこっちへいったり… コメントが適切に書かれていれば、このメソッドはどこでどう必要になっていて なぜこの引数が必要なのかなど、そういう情報が一目で分かる

ドキュメントとしての見出しはもちろん もう書けるところは全部書く

ブラウザ固有のバグを対応したところなどは絶対書く

そういうのがないと… あとで他の人が泣く…

複数人で開発するときに揃えたほうがいいところ: どのクラス/コンストラクタ/オブジェクトのメソッドを実行しているのかを明示する

気づいたところをメモしていくところ。今さら…とか恥ずかしがらずに書く。

どのクラス/コンストラクタ/オブジェクトのメソッドを実行しているのかを明示する

例えばSuperPagesと、これを継承するBasicPagesという二つのコレクションがあり、これらはどちらも使うものとする。

SuperPagesがgetというメソッドを持っていた場合、BasicPagesももちろんgetメソッドを持っているが、どこかのクラスだかコンストラクタで、

initializeMethod: function() {
  this.collection = new SuperPages();
},
getPages: function() {
  return this.collection.get();
}

こういう風に書いてしまうと、後々見たときに、

getPages: function() {
  return this.collection.get();
}

ここだけを見て、どのコレクションに対するgetなのか分からず、検索が出来ない。。

というわけなので、明示しておく。

initializeMethod: function() {
  this.superPages = new SuperPages();
},
getPages: function() {
  return this.superPages.get();
}

明示というか、こういうクラスやコンストラクタをどこかで使うときは別の名称(collectionのような)を使用せずに、識別子として名前をそのまま使ったほうが、後で見る人がうれしい。

フレームワークを使うと、同じメソッド名が量産されるので、より意識したほうがよい。

$('<div class="hoge">')はIE8以下ではダメ

ふむ、知らなかった。IE8以下だとうまく要素が作れないので

$('<div class="hoge"/>')

または

$('<div class="hoge"></div>')

または

$('<div>').addClass('hoge')

とする。久しぶりにjQuery関連でハマってちょっとだけうれしい。
classがダメなんじゃなくて、属性関連も全部ダメ。単独じゃない場合は、閉じる必要アリってことです。

ここにGitHubを便利に使うUserScriptが2つあります

  • GitHubのIssueナンバーをタイトルに表示する
  • GitHubのIssueページに検索ボックスをとても分かりやすい位置に置く

最初のやつはあれば便利っていう感じだけど、

f:id:nori_17:20131108150834p:plain

f:id:nori_17:20131108150839p:plain

画像がでかいな・・・

二つめのやつなんか、ぱっとみどこにあるか分かりますかね。

f:id:nori_17:20131108150700p:plain

ヘッダーにある・・・Issueを検索するときに見つけられなかったので、とても分かりやすい位置に置きました。

f:id:nori_17:20131108150710p:plain

はい。

簡単なUserScriptだけど、使いたい人はどうぞ

Backbone.jsでsetするときにvalidateが動かないじゃん

だまってvalidateオプションをtrueにするんだ

model.set('hoge', 'fuga', { validate: true });

パズドラ風アイコンジェネレーター ver.2で画像サイズとフレームなしも選べるようになった

Facebookのアイコンサイズが180x180らしいので、180x180(実際はちょっと大きくなっちゃうけど)も選べるようにした

f:id:nori_17:20131020175532p:plain

f:id:nori_17:20131020175541p:plain

あとフレームなしも選べるようになった

f:id:nori_17:20131020175548p:plain