blog
最近、オフィスの引っ越しを考えているので@machidaさんと不動産屋を巡っていました。
そこで初台一怪しい不動産屋、ビビアンに行ってきました。(今のオフィスは初台にあります。)
「ビビァーーーン!!!」(@荒木飛呂彦)
この写真では伝わりづらいのですが、内壁が全てピンクです。こちらの要望を伝えると、不動産のファックスの下の部分(直接取り扱っている不動産屋が書いてある)を隠してこちらに見せてくれます。宅建の証明書の横には和服の店長(ママ)の写真が貼ってあります。
実際に物件を見ることになりました。ビビアンのママが得意気によこしたのは電動自転車の鍵。
「物件見学に全員でチャリ。そういうのもあるのか!」(@井之頭五郎)
電動アシストの自転車、はじめて乗りましたが面白いですね。昼間から奇声を上げて走りまわってしまいました。そしてビビアンのママはというと、すごく速いんです・・・。電動自転車で爆走するビビアンのママを後ろから見ていると自然と笑いが込み上げてきてiPhoneで咄嗟にビデオを撮ってしまいました。
すいません・・・仕事します。
おまけ
@mongorian_chopさんがHTMLのインデントを綺麗にする誰得サービスHam CutletのChrome ExtensionをGoogle Chrome 拡張機能ギャラリーに登録してくれました。アイコンは@machidaさん作です。僕は何もしてません。
毎週火曜日、Help me, hackers!に上がったコードを紹介していくコードDJ 第a回。
コレを作ってて2ヶ月近くポストして無かったですけどなにか?
(@佐々木健介)
komagata a.k.a. DJです。
今回紹介するのはコレ。
Ham CutletをHTML5に対応する – Help me, hackers!
HTMLのインデントを綺麗にする誰得サービスHam Cutlet。内部で使ってるHamlがデフォルトxhtmlなのでhtml5を食わせるとコードが破壊される。それを解決してくれたナイスガイがmat_aki a.k.a. youroomの中の人。ありがとう!
mat_akiのパッチはこのコードに集約される。
app.rb at 236baf240828a805726a49adb8c76fd4f048f802 from mataki’s hamcutlet – GitHub
[cc lang="ruby"] def html2haml(html)
html5 = (doctype = Hpricot(html).children.detect{ |e| e.doctype? }) ? doctype.public_id.nil? : false
haml = Haml::HTML.new(html.gsub(/\t/, ‘ ‘)).render
Haml::Engine.new(haml, :attr_wrapper => ‘”‘, :format => html5 ? :html5 :
html ).render
end[/cc]
doctypeを見てHTML5なのか、それ以外なのかを判断してる。
[cc lang="html"][/cc]
XHTML 1.0のdoctypeはこんな感じ。PUBLICなんとかがある。
[cc lang="html"][/cc]
HTML5のdoctypeはこんな感じでシンプル。
Hpricotを使って「doctypeがあるけどpublicなんとかが無いものはHTML5」としている。Haml::Engineが元からやって欲しいような気もするが、将来のバージョンではそうなるのかもしれない。
気づいたらHam Cutletもいつのまにやら色んなプログラマーの手が入ってるプロジェクトになってる。kyannyの気付かない内にmat_akiとコラボレーションしてる状態になってるんじゃないかなどと考えると面白い。オマエら一緒のコードいじってるぜ!
「そういえば今日はなんとなくいつもと会社の近くの雰囲気が違ってたような…」
今日が祝日だったってことに出勤してから気づいたということがフィヨルドでたまにあります。
フィヨルドは僕(@machida)と@komagataさんの独身一人暮らしのおっさん二人でやってる会社なので、休日の家族サービスなんかをすることもなく、ついつい祝日をチェックするのを忘れてしまいがち。
昨日(2010年9月13日)、twitterのTLで「今月は秋の大型連休、シルバーウイークがある」という情報を見つけたので、それはいつのなのかデニーズで食事をしながらiPhoneで検索をしてみたのですが、なかなか見つからない…ということがありました。で、その日のうちに我々で作ってしまいました。自分のドッグフードをもぐもぐ頬張ったサービスです。

次の祝日を教えてくれるサービス「Next Holiday」
デザインは、今年の夏も海に行かなかったなー、って思いながら作ってたらこうなりました。
プログラムの中身については@komagataさんまでお願いします。
heroku、Sinatraで一時間弱で作ってくれました。
追記
@komagataさんが Next Holidy の中身について書いてくれました。
http://fjord.jp/love/494.html
三鷹の近くでrubyist(プログラム言語rubyを扱ってるプログラマさん)が集まり、美味しいものを食べながらプログラムのことなどの情報交換をするイベント、その名も「Mitaka.rb」。
その告知に出てた料理の写真があまりに美味しそうだったのでラペコの「ぺこぺこになった!」ボタンをクリックするノリで「このイベントに参加する」ボタンをクリック。

告知の料理画像に惹かれて僕(@machida)と@komagataさんも参加してしまいました。

ぺこぺこになった
Mitaka.rbとは…
「Mitaka.rb」は東京都三鷹で不定期開催されているRuby/Railsの地域コミュニティです。参加者はRuby/Rails関係者、WEB サービス関係者などで毎回20-40人の参加があります。「たのしいRuby、おいしいMitaka」をコンセプトに周辺の飲食店を会場に開催しており懇親会の後LT(Lightning Talk)をするのが通例です。Ruby/Railsの話ができて、お気に入りの店も増える、そんなコミュニティを目指しています。
さすがに「たのしいRuby、おいしいMitaka」をコンセプトにしているだけあって、料理が美味しい美味しい!
Mitaka.rb #10の会場は吉祥寺の「Bistro epices」というお店を貸し切って行なったのですが、さすがのお店チョイスです。
イベントじゃなくても利用したいレストラン、おすすめです。
しかも主催者の@ysakakiさんが懸賞に当たったので6000円のコースのうちの2000円を負担していただき、さらに(株)HatchUp様がスポンサーとして一人1000円の補助!
結局半額でご馳走になってしまいました。
@ysakakiさん、(株)HatchUp様、ご馳走様でした!
イベントのお手伝いをしていただいた前田製作所、つくる社の@monoookiさんがイベントのtweetをまとめてくださいました。
本当、tweetにもあるようにtweetの内容だけ見てると美食の会です。
せっかくイベントに参加するのだからと@komagataさんがLTの発表側にも参加してました。内容は@komagataさんがこの夏の自由研究で作ってるcloudで動くrubyで出来たCMS「pyha(ピュハ)」について。このイベントで発表するからと、イベントの数時間前に公式サイトをオープン。pyhaバージョン0.0.1もリリースしました。そのときのスライドは@komagataさんのブログにあがってます(ココ)。僕も一部、スライドで使ってる画像の加工で協力しました。
pyha、是非使ってみてください。
HTMLのインデントを綺麗にするだけのサービス、Ham Cutletを英語対応にしました。ブラウザの言語設定で英語が優先になってる人には英語で表示されるようになりました。
HTMLのインデントを病的に気にする外人さんがいたらオススメしてください・・・。
長らくブログを書かなかったので、右カラムの新着記事の一覧が@komagataさんのアイコンに占領されるという自体に。
ちょっと先月(2010年7月)はバタバタしてたのですが、お盆も終わったことだし、バタバタしてしまった反省もしたし、これからちょくちょくブログを書いていきます。
このバタバタしてたときにとっても役に立ったtodo管理のwebアプリ、todo.ly。
ものすごく使いやすくて、これを知った瞬間からすっかりヘヴィユーザーになりました。
http://todo.ly/
外国の先端のwebサービスって感じのトップページ。
僕はこの手のデザインに弱くて、ついつい使いたくなってしまいます。
sign upしたらメインのページへ。
すごくシンプルなメインページだけど、実はこのサービス、to do管理ツールの部分は下の画像にある1ページのみでページの遷移は一切ありません。

todo.lyにあるもの
左カラム
- Filters(to doの一覧を絞り込む)
- Projects(to doのカテゴリーの一覧を表示させる)
- Recycle Bin(ゴミ箱)
メインカラム
- to doの一覧の表示
- to doの新規追加の為の入力ボックス
これだけ!
このシンプルさは素敵過ぎ。
なんと言ってもtodo.lyはスピーディーに使えるところが使いたくなるポイント。
これはtodo.ly自体がAjaxでサクサク動くっていうのもあるし、UIもサクサクとタスクを登録できるように出来てる。
to do登録の手順
- まずはこれから登録するto doのカテゴリーを左カラムから選んでクリック。
- あとはto doの内容をメインカラムのボックスに入力するだけ。
to doを登録する際に考えることは、「to doのカテゴリー」と「to doの内容の文」だけ。
ページが遷移しないからサクサク動いてto doを登録するのに数秒しかかからない。
だからガンガンto do登録が進みます。
to doに期日(Due Date)も登録することができますが、しなくてもOK。必要なときはto do登録ボックスの下の「more」をクリックをすれば期日登録のボックスが表示されますが、「more」をクリックするまでは期日登録ボックスが目に入らないところもサクサク感を感じるポイントですね。
まぁ、上記の機能も動作も使い方もremember the milkにあるんだけど、Remember The Milkにはもっと機能があって、todo.lyの方はこれだけ。その分画面にある文字の量も情報も少ないので、Remember The Milkに比べてもっと使うのが簡単そうに見えます。
簡単そうだから特にIT系じゃないパソコンを使う人に勧めやすいです。僕が「使いたい」って思ったのも、やっぱり簡単そうだったから。まずは簡単そうに見えること、そして簡単なこと、これが大事ですね。
付箋にto doを書いてパソコンのモニターに貼ったりだとか、テキストエディタにto doリストを書いて終わったら消していく、なんて作業をやっているのを見たときに教えたくなるようなサービスです。
RubyInstallerのロゴが凄いです。
RubyInstallerはプログラミング言語のRubyをWindowsに簡単にインストールできるソフトです。
Windowsロゴ
Rubyロゴ
RubyInstallerロゴ
RubyのロゴとWindowsのロゴをうまい具合に組み合わせてあるので、両方を知ってる人なら見ただけでどういうものか分かりそうです。
そもそもRubyInstallerのロゴはデザインコンテストを行って広く募集した中から投票で1位に選ばれた物です。オープンソースのソフトなどはどうしてもプログラマー寄りの物が多く、デザインは後回しになってしまうことが多いですが、一般の方にも使ってもらうにはデザインはとても重要なので、こうした成果物を見ると、こういったコンテストはとても有効だと思いました。
つくる社さんの環境構築ガイドを勉強してKEIO Railsのイベントに参加しようとした矢先、@machidaさんがWindowsからMacにSwitchしてしまって、当日何も出来ずに精神的に追い詰められてゲロを吐いてしまいそうだというのでMac用のガイドを書いてみます。
全面参考:デザイナーのための Ruby on Rails + Windows 環境構築ガイド | つくる社LLC
Railsのアプリを作るには下記の物をインストールする必要があります。
- Xcode + iOS SDK(両方必要無いが、MacPortsを使うのに必要なソフトが一杯付いてくる)
- MacPorts(Macのアプリを簡単にインストールするプログラム)
- Ruby(プログラミング言語)
- RubyGems(Rubyのライブラリを簡単にインストールするプログラム)
- SQLite3(データベース。Railsのデフォルトデータベース)
- Ruby on Rails(RubyのWebアプリが簡単に作れるフレームワーク)
Xcode + iOS SDKのインストール
下記から最新版をダウンロードしてインストール。(要デベロッパー登録)
https://developer.apple.com/mac/
MacPortsをインストール
下記から最新版をダウンロードしてインストール。(数字が一番大きくて、SnowLeopard対応で拡張子がdmgのヤツ)
例:MacPorts-1.9.1-10.6-SnowLeopard.dmg
http://distfiles.macports.org/MacPorts/
Ruby、RubyGems、SQLite3をインストール
ターミナル.app(別名「黒い画面」)で下記を入力。
sudo port install ruby rb-rubygems sqlite3 rb-sqlite3
RubyGemsを最新版にアップデート
sudo gem update --system
Ruby on Railsをインストール
sudo gem install rails
サンプルアプリを作成してRailsの動作確認
cd (ホームディレクトリに移動)
mkdir rails
cd rails
rails test (test という Rails アプリを作成)
cd test
ruby script/generate scaffold Customer name:string (name というフィールドをひとつだけ持った Customer というモデルをベースにテンプレートの画面を作成)
rake db:migrate (DB にテーブルを作成)
ruby script/server (アプリケーションサーバーを起動)
ブラウザより、http://localhost:3000/customers にアクセスし、New customer で新しいレコードを追加したり、そのあと編集・削除などの操作ができれば成功です。













