スカンディナヴィア半島3をリリースしました
これです
Webから主にリストをだらっとマルチカラムで一気に見れるクライアントです。WebクライアントなのでOS非依存、動作確認したのはOpera 11.62、Chrome 18です。Firefoxはたぶん動きます。IE9はたしかうごかなかったです。詳しい内容はリンクからどうぞ。
以下技術的な話と個人的な話。
スカンディナヴィア半島2の挫折から約2週間
思ったよりすんなりいけた。前回でいろいろつくっていたのがかなり流用できたから楽できたのもあるし、そもそもスカンディナヴィア半島1.5で大きくリファクタしたからそっからかなり流用できた。作ったのはOAuth認証するところと、jQueryするところと、CoffeeScriptするところと、iframeにPOSTするところくらい？設定をJSONにしてlocalStorageにするってのはやったな。Lessは導入したけど無駄にborder-radiusしただけであんまり活用はできてない。デザインは結構手抜きだけど、このくらいシンプルなクライアントでいいかなってかんじだ。やりたければUser Style Sheetできるようにしたし。
機能
- OAuth対応
- コピペが面倒ですが仕様です。ブラウザ拡張でもGMでもないXHRだから仕方ない
- Home Timeline、Mention、DM(読むだけ)、List、Search対応
- DMはかなり適当だけど、HomeとMentionとListは結局Status Objectを扱うので同じ。SearchとDMはAPIの構造が違ってちょっとだるかったけどまあ対応した。簡単だったし。
- GUIコンフィグ対応
- フォームからちびちびと設定できます。当たり前だけど保存したら次回からちゃんとそれが参照できるようにもした。当たり前をつくるのにもちょっと手間がかかった。
- 日本語ハッシュタグフィルタ
- おれがウザいから基本的にはオンしてるけど、オプションでオフにできるようにした。診断メーカーとgohantabeyoはダルいので対応してない。
- User Style Sheet対応
- style要素を動的に挿入するとわかれば実装は一瞬でできた
あとは普通にt.coを展開したり、@や#をリンクにしたり。
できなかったこと
- 任意の間隔でストリームごとのリロード、またTLの継ぎ足し
- これは結局最後までできなかった。これができてればオレ的にはTweetDeck for Chrome並に使えたけど、コールバックでとってくるモデルだとどうしても解決できなかった
このくらいか。あとはおおむね満足している。
スカンディナヴィア半島はおれの初めてのプログラムなんだ
先ほどのリンクからgistをたどってもらったらどんだけ素人で構造化されてなくて抽象化されてない初心者丸出しのコードかはっきりわかる。それが1.5で @xxxxxxxxx に JavaScriptでオブジェクト志向的に、MVC的に書く - atas こんな感じで構造化してもらってヒントを得た。OAuth対応しないのならある程度やれることは限られていたので、がんばってOAuth対応してやろうとしたのがスカンディナヴィア半島2だ。Djangoでtweepy使ってやろうとした。でも公式RTで挫折したり、そもそもModelにTweetをSaveさせたり微妙で破綻してしまった。もしかしたらbpmappersを駆使してJSONを返せてたらよかったのかもしれないけど、それなら結局今回のスカンディナヴィア半島3とほぼ同じだ。
今回のスカンディナヴィア半島3はjQueryとCoffeeScript(とLess)を勉強しながらスカンディナヴィア半島をOAuthに対応させるプロジェクトだった。結果的には便利に使えてるし、成功しているかなっておもう。どれだけの人がつかってくれるかは知らないけど、すくなくてもおれは今までもこれからも使っていく。
技術的な軌跡
Node環境を整えてCoffeeScript+lessをvim vim しちゃうメモ - atas
$.ajaxしたらsuccessする必要があるよ！！！！ - atas
jQuery使うときはちゃんとjQueryに閉じた使い方をしないとハマるって話 - atas
JavaScriptでTwitterのOAuthを取り付けて通信する方法 - atas
Operaの場合XHR2対応してないからiframeでクロスドメインでPOSTする - atas
(jQuery)Eventをとった時にtoElementを使えるのはChromeだけだったという話 - atas
記事になってるのはこんだけか。まあわりと地道なロジックを作ってただけだからあんまりすごいことはない。
jQueryがどれだけ便利かは結局よくわからなかった。皆があまりに当たり前にjQueryを使う世の中なのでせめてつかえないとなーということで使った。jQueryはjQueryと言う名のドメインとはいったもので、ほんとに独自の言語みたいだった。セレクタは便利だね。他の機能はほとんど使ってないです。text() html() val() $.ajax あたりとセレクタを駆使したくらいです。
CoffeeScriptはとてもいいですね。楽にかける。最近「CoffeeScriptをプロダクトやOSSに使うのはどうか」という話で盛り上がってましたね。まあそれについてはどうとも言えない*1けれど、少なくても個人的にババっと作るには本当に気が楽でした。 functionが -> というのはいいとして、連想配列を作るのも簡単だし、インデントも揃うし、変なSyntax ErrorはVimのプラグインが即座に察知してくれて楽だし。何より文字列フォーマットができるのがすごく楽でしたね。 "#{arg1}::#{arg2}"みたいなのを直感的に書けるのは他の言語では簡単にできてもJSでは未だにできないから、それが気楽でした。あと classs を記述して生成された JS を改めてみて protopype の勉強になったりして。 for in と for of でたまに混乱しましたが、CoffeeScriptはなにより気楽に書けるのがいいですね！少なくても趣味コーディングには。
Lessに関しては無駄に border-radius のサンプルをコピペしただけのでどうともです。少なくても導入の敷居は低いし、CSSをちょっと拡張しているだけだから取り回しが楽な印象でした。もっと普通のサイトをつくるのなら便利かもしれないけど、今回はそもそもCSSの記述量自体が少ないのでそこまでありがたみを感じませんでした。
あとの細かい話はgithubに上げておいたのでそちらを参考にしてください。
そんなこんなで
やったーできたよー。よかったらつかってねー！
ありがとうございました
Twicli製作者 @xxxxx さん。クロスドメインPOSTなどの助言で @yyyyyy さん。その他もろもろ、そもそもスカンディナヴィア半島1.0から @zzzzzzzzz さん。そうそうたるメンツの助言のお陰でこのプログラムはできました。
