読者です 読者をやめる 読者になる 読者になる

TitaniumMobile勉強記

Web系エンジニア向けのキャリアアドバイザーやってましたが現在はフリーランスで開発含めて色々やってます。技術ネタとしてはRuby/RailsとJavaScript関連(Node.js、Titanium)あたり

人脈管理のツールをSinatra+hamlで作り始めてます

ruby Sinatra

最近は、Titanium Mobileいじるのはしばらくお休みして、人脈管理のツールをSinatra+hamlで作り始めてます

長い前置き

今季の自分の仕事の目標として、社外の色々な経験を持った人に多数お会いして、オフライン⇔オンラインの交流を通じて、自社のビジネスに結びつけるというのを掲げてます。

自社のビジネスに結びつけるで一番わかりやすいのは、転職支援。ただ、それがあまりにも露骨に出て人脈形成とかやっていっても、普通に考えたら相手は身構えるし、そもそもそういうのを意識した行動が自分自身好きじゃないので、正直な所、そういうことがあったらいいかな位にしか考えてません。

転職支援以外で、自社のビジネスに関連することというと、技術セミナーや、キャリアセミナーの講演依頼。

これまでも、こういうセミナーは何度も開催してるのですが、お話いただく方が定番化しつつあったり、テーマにふさわしい内容でお話いただけそうな方と接点が無いという課題を感じていたので、これをうまく使おうかなと決めました。

講師いただく方にとっては、アウトプットする機会を通じて、技術スキル以外の経験も得ることが出来て何かしらのプラスになるかなと思ってます。

また、自分(というかうちの会社)としても、IT関連の技術/キャリアセミナーで従来にはないテーマのものが打ち出せることで、これまでと違った層の人材獲得につながるかと思ってます。(ついでにいうと、講師同士、セミナー参加者同士の交流する機会を別途設けることで、コミュニティ的なものの形成ができるんじゃないかとちょっと妄想もしてます)

ツールが必要になってきた事情

さて、この辺から本題にはいろうかと思います。ここ3,4ヶ月程度で、主にCoffeeMeetingというサービスを通じて、30名以上の方とお会いすることが出来ました。

何かあったら仕事のお願いをしたいと思えるような魅力的な人が多いのですが、今後もこの活動を継続していくと、お会いした人と、いつ、どんな話をして、今後どんなお願いをしたいのかを一覧出来るようなものが無いと厳しいかと思って、人脈管理のためのツールを作り始めました

f:id:h5y1m141:20120922080034j:plain

システム構成としては現状こんな感じでやろうかと思ってます

  • Sinatra
  • テンプレートエンジンにhaml利用
  • バックエンドのDBにMongoDB利用。

現在は手元のMacでテスト環境整えているのですが、最終的な実行環境はHerokuを使うか、それともさくらVPS上のサーバをつかうか、MongoDBだけMongoLabを利用するか色々検討中。

hamlで条件分岐させながらレイアウト生成するのにハマった

MongoDB上で、こんな感じでユーザ情報を保持してます

{
        "_id" : ObjectId("5053e5b88b7d5c08c700005b"),
        "uid" : NumberLong("100001709714132"),
        "name" : "Tarou",
        "pic_square" : "http://profile.ak.fbcdn.net/xxxxx_q.jpg",
        "about_me" : null,
        "memo" : [
                {
                        "data" : "日本語入力Test",
                        "postdate" : ISODate("2012-09-15T06:23:34.481Z")
                },
                {
                        "data" : "再度入力",
                        "postdate" : ISODate("2012-09-15T06:23:47.497Z")
                }
        ],
        "friends" : [
                         {"uid" : xxx},{"name" : "Hanako "},{"pic_square" : "http://xxx/1.jpg"},
                         {"uid" : xxx},{"name" : "Kazuyo "},{"pic_square" : "http://xxx/2.jpg"},
        ]
}

ユーザのTarouさんの知り合いは2名(Hanakoさん、Kazuyoさん)いるけど、例えば、別のユーザ(仮にTeruoさん)は現状知り合いが0名というような状況もあるはずなので、そういうデータ構造に対応したhamlテンプレートを作り始めました

haml 内にRubyコードを埋め込んで、if文で条件分岐して・・・というのは、コードの見通し悪そうだし色々やってもうまくいかないので、もっとスマートな方法があるはずと思って色々調べていました

stackoverflowにHow to do an if/else in HAML without repeating indented codeという記事を見つけて、ヘルパーメソッドというのを活用すればいいのかなと気づきました

最初どこに書いて良いのかわからずに、hamlファイル内に

!!!
%html{:lang => "en"}
  %head
    %title Unicorn Admin
    %meta{:charset => "UTF-8"}/
    %link{:href => "css/bootstrap.min.css", :rel => "stylesheet"}/
    %link{:href => "css/bootstrap-responsive.min.css", :rel => "stylesheet"}/
    %link{:href => "css/uniform.css", :rel => "stylesheet"}/
    %link{:href => "css/chosen.css", :rel => "stylesheet"}/
    %link{:href => "css/unicorn.main.css", :rel => "stylesheet"}/
    %link.skin-color{:href => "css/unicorn.grey.css", :rel => "stylesheet"}/
  %body

def build_img_tag
  xxx
end

という感じで書いて実行したら、Sinatraに怒られてしまい、どこに書けば良いのか途方にくれていました。
sinatra haml helper” というキーワードでググッたら、ウノウラボのページを見つけて、これを読んで

「あ、Sinatraにヘルパーメソッドというのがあるのか」

となんとなく分かりました。app.rbに

class App < Sinatra::Base
  helpers do
    def body_attributes(item)
      return unless item
      item.each do |i|
        haml_tag 'img.img-rounded' ,{:src => i['pic_square']}
        haml_concat i['name']
      end
    end
  get '/table' do
  # 以下省略
end

とすることで、無事解決できました。

クロールした結果をJSONで返すAPI的なものを以前Sinatraで実装したことがあるのですが、Webアプリ的なものを作るのが今回はじめてなのと、Railsに比べるとSinatraは情報量が少ないけど作っていて楽しいですね。

どうでもいいけど、UIデザインをゼロベースで作るのは流石に自分ではどうにもできないので、twitter bootstrapベースのテーマが集まってるサイトで、それっぽい雰囲気のテンプレートを買いました