CurryBu 開発日誌

今日食べたカレーを共有する CurryBu の開発ブログです。

CurryBu 開発月報 2014 年 2 月号

こんにちは。金曜日ですね。 金曜日は平和に過ごしたいものです。

1 月から開発月報というものを始めてみています。

CurryBu 開発月報 2014 年 1 月号
http://blog.currybu.com/post/75849351524/dev-report-2014-01

2 月も開発しましたよー!それでは行ってみましょう。

カレーを自動で Twitter にポストできるようになりました

カレーを投稿する時に Twitter にポストできるようになりました。
紹介記事を書いていますので良かったら読んでみてください。

カレーを自動で Twitter にポストできるようになりました
http://blog.currybu.com/post/78086540087/curry-post-to-twitter

Facebook 連携については... Issue はあるのですが、対応しようか迷っているところです。

Sidekiq を導入

Twitter に投稿する対応を行う際に、Twitter との通信をバックグラウンドで処理する必要が出てきたため、 Sidekiq を導入しました。 ドキュメントやサンプルコードが充実していますので、すんなり組み込めました。

ついでに Devise Async を導入して、 Devise を使用したメール送信(パスワードの再発行やメールアドレスの確認)をバックグラウンドで行うようにしました。

initializer はこのような感じで書いています。ドライバに hiredis を使ったり、namespace を指定しています。

# config/initializers/sidekiq.rb
config = Setting.redis
namespace = [Rails.application.class.parent_name.downcase, Rails.env, 'sidekiq'].join ':'

redis_options = {
  url: "redis://#{config.host}:#{config.port}/0",
  driver: :hiredis,
  namespace: namespace
}

Sidekiq.configure_server do |config|
  config.redis = redis_options
end

Sidekiq.configure_client do |config|
  config.redis = redis_options
end

バックグラウンド処理といえば、Sidekiq の他に Delayed::Job や Resque などが似たようなツールとして挙げられますが、なぜ Sidekiq を使ったか? 正直なことを言うと「Sidekiq だけ使ったことが無かったので使ってみたかった」ということになるのですが、理由を考えてみました。まあどのプロダクトでも良いと思います。

  • Sidekiq はスレッドで動作するため、ジョブごとにプロセスをフォークする Delayed::Job や Resque に比べると、メモリの使用量が少ない
    • Resque を使わない理由が無く、敢えて挙げるのであればこの点か...
  • Delayed::Job はキュー情報の格納に Active Record または Mongoid を使用するが、キュー情報を PostgreSQL に格納するのは個人的に違和感がある
    • Redis を使っているので、そちらにキュー情報を格納したい

ただ Sidekiq に不満が無いというわけでもなく、付属している Web インターフェイスでは、ジョブがリトライするようになっていないと失敗したキューのバックトレースが表示できない、などがあります。(本当はできるのかも知れません。どなたか教えてくださいm( )m)

Sidekiq は投入したばかりなので、障害が起きることもあるかもしれませんが、暖かく見守ってやってください。

ワーカーの監視には monit を使用しています。

「気になるカレー」にコメントも表示

「気になるカレー」には、いいね!のみを表示していましたが、コメントした場合も表示するようにしました。

viewport の拡大を無効化

スマートフォン版のページでは、ピンチ操作を使用した拡大・縮小が行えるようになっていましたが、 投稿ページなどでフォームに文字を入力しようとした時に画面が拡大され、元の表示に戻すには画面を縮小する必要がありました。

そこで、スマートフォン版では、投稿画像やユーザー画像について十分なサイズの画像が表示されているとのことで、拡大・縮小を行えないようにしました。

Rails 4.0.3

Rails 4.0.3 がリリースされ、アップデートしました。 セキュリティに関する修正が入ったアップデートであり、Rails 3.2.17 も同時にリリースされていますので、ぜひアップデートしましょう。

Riding Rails: Rails 3.2.17, 4.0.3 and 4.1.0.beta2 have been released! http://weblog.rubyonrails.org/2014/2/18/Rails_3_2_17_4_0_3_and_4_1_0_beta2_have_been_released/

Rails 4.1.0 の Release candidate 1 がリリースされましたね。 Beta 1 は Basecamp の本番環境で実際に動いているということで、安定してきているようです。

Rails 4.1 については下記の記事で新しい機能が紹介されていますので良かったらどうぞ。
個人的には Action Pack Variants が楽しみです。

What's new in Rails 4.1 - Coherence Blog
http://coherence.io/blog/2013/12/17/whats-new-in-rails-4-1.html

Ruby 2.1.1

Ruby 2.1.1 がリリースされ、アップデートしました。

Ruby 2.1.1 リリース
https://www.ruby-lang.org/ja/news/2014/02/24/ruby-2-1-1-is-released/

早速アップデートして様子を見ていますが、今のところ問題は出ていません。

しかし、一部でデグレードが発生し、Rails プロジェクトにも影響が出る可能性があるようです。 CurryBu では問題になるような処理をしていないため影響はありませんでした。

Ruby 2.1.1 で Hash#rejectデグレ - diary.sorah
http://diary.sorah.jp/2014/02/28/ruby211-hash-reject

[4.0.3/4-0-stable] ActiveSupport::HashWithIndifferentAccess regression with Ruby 2.1.1
https://github.com/rails/rails/issues/14188

偶然にも、 Ruby 2.1.1 をアップデートを行った時の CurryBu のバージョンが 2.1.1 でした。

今回は以上です。
まだまだ寒い日が続くようですね。それでは良い週末を :)

カレーを自動で Twitter にポストできるようになりました

こんにちは。今日は良い昼寝日和ですね。

カレーを投稿した時に、自動で Twitter にポストできるようになりました。

Twitter に接続する

まずは CurryBu のアカウントと Twitter のアカウントを接続する必要があります。
※PC 版の説明になりますが、スマートフォン版でも同様に設定できます!

マイページの設定にアクセスして、ページの真ん中辺りにある「Twitter に接続する」をクリックしてください。

Twitter の確認ページが表示されますので「連携アプリを認証」をクリックしてください。
( スクリーンショットでは「Authorize app」となっています。 )

これで Twitter と接続されました。

マイページの設定に「投稿をツイートする」というオプションが表示されます。

  • ON の場合は、投稿ページの「Twitter に投稿する」オプションがデフォルトで有効
  • OFF の場合は、投稿ページの「Twitter に投稿する」オプションがデフォルトで無効

設定したオプションとは関係なく、Twitter にポストするかどうかは、投稿時に個別に選択できます

Twitter に投稿する

カレーを投稿する直前に「Twitter に投稿する」かどうかを選択できるようになります。

この設定を切り替えることで、投稿するカレーを Twitter に投稿するか決めることができます。

Twitter には以下のような形式で投稿されます

Twitter の接続を解除する

マイページの設定から「Twitter と接続解除する」をクリックすることで解除することができます。

投稿しましょう!

Twitter 投稿をぜひ使ってみてください!

もちろん、今までどおりカレーのページから TwitterFacebook に個別に投稿することもできます。

もし「投稿されない!」というような不具合が発生した場合は、 @CurryBu_メールで問い合わせていただければ調査させていただきます。

それでは、良い週末を! :)

CurryBu 開発月報 2014 年 1 月号

こんにちは。

idobata.io さんの開発ブログでは毎月、サービスの新機能や変更などを告知されています。個人的にそのような記事を読むのが好きなので、CurryBu でも新機能や変更、修正した点を 当たり障りのない範囲で 紹介してみようと思います。今回は 2014 年 1 月分です。

リニューアル

1 月の一番大きなトピックは、やはりリニューアルです。
リニューアルについては記事を書いていますので、良かったら読んでください。

新しい CurryBu をリリースしました!
http://blog.currybu.com/post/74674615762/new-curry-bu-released

一部の CSS/JS が CloudFront から配信されない件の修正

CSS/JS/画像を CloudFront から配信しているのですが、stylesheet_link_tagjavascript_include_tag で指定している CSS/JS のパスが CloudFront のパスではなく Web サーバーのパスになるという問題が起きていました。

以前は、initializer の中で以下のような感じで config.action_controller.asset_host を設定していました。

# config/initializers/asset_host.rb
Foo::Application.config.action_controller.asset_host = Setting.rails.asset_host

しかし、stylesheet_link_tag などのリンク生成では、initializer ではなく environments 内の環境設定(production.rb など) に書いていないと、asset_host が適用されないようです。(precompile では適用される)

解決方法を知っている方がいましたらぜひ教えてください!

投稿ページで NewRelic の計測スクリプトが埋め込まれない件の修正

NewRelic のブラウザ上のパフォーマンス計測スクリプト(データ)が埋め込まれず、計測されないという問題が起きていました。

newrelic_rpm gem は計測スクリプトを埋め込む時に、ドキュメントの最初の 50 KB から body タグの開始位置を見つけようとします。見つからなかった場合、計測スクリプトは埋め込まれません。

# https://github.com/newrelic/rpm/blob/470d3aa39ee786523fe1e6324a7b9d2d509b4e53/lib/new_relic/rack/browser_monitoring.rb#L60-61
# Only scan the first 50k (roughly) then give up.
beginning_of_source = source[0..50_000]

if body_start = find_body_start(beginning_of_source)
  ...

投稿ページでは、gon gem を使用して、お店の情報を JSON で埋め込むようにしています。 今回の場合、body タグの前にお店の JSON データが埋め込まれており、newrelic_rpm gem が body タグを見つけるまでに 50 KB を超えていたために計測スクリプトが埋め込まれない、という状態になっていました。

対応としては微妙なのですが、JSON データを body タグ内の最後の方、サービスの JS を読み込む直前に移動することで解決しました。 どちらにしろ、お店の件数が増えてくると、ページ内の埋め込みでは処理できなくなりますので、近いうちに API 化したいなと思っています。

/u/ は /users にリダイレクトする

ユーザーページは、例えば /u/chocoby という URL になるのですが、/u にアクセスした時に 404 になっていました。 しかし、/u/ は階層的には「ユーザーページ」の一つ上であり、「ユーザー一覧ページ」になりますので、/users にリダイレクトするようにしました。

@key3 さん、アドバイスありがとうございます。

投稿画像、ユーザー画像のサイズを修正

これまで、画像サイズは thumb/normal の 2 種類を用意していたのですが、今回のリニューアルで、一部のページにおいて最適なサイズの画像が割り当てられておらず、画質が悪く表示される箇所が出てきました。 そこで、色々なサイズに対応するため、small/medium/large/xlarge の 4 種類(ユーザー画像は 3 種類)を用意するようにしました。 PC/スマートフォン両方で、Retina ディスプレイでも綺麗に表示できるように調整していますが、画質が良くない箇所がありましたら教えてください。

4 種類の画像を生成するため、登録時のユーザーへのレスポンスが若干遅くなってしまうところを改善したいです。

ブラウザのパフォーマンスの為には、リフローやリペイントが発生しないように、高さと幅がぴったりと合った画像を用意することが良いと言われています。また、サイズに変更があった際に既存の画像のリサイズ処理を行うのも時間がかかります。それらの問題を解決するために、クックパッドさんの tofu のような、URL のパラメーターから画像を動的にリサイズして配信できるような仕組みが欲しいなと思いました。今後の課題です。

また、carrierwave gem では recreate_versions! で画像を再生成した際に、古い version (今回の場合は thumb/normal) の画像が削除されないようでした。 CurryBu では画像の保存に S3 を使用していますので、aws-sdk gem を使用し、以下のようなスクリプトを作成して古い version を削除しました。

s3 = AWS::S3.new

# ...

bucket = s3.buckets[BUCKET]
bucket.objects.each do |obj|
  if obj.key =~ /\/(normal|thumb)_/
    pp obj.key
    obj.delete
  end
end

今回は以上となります。いかがでしたか?

え、そんなことよりカレーが食べたい?今日は金曜日です!お昼はカレーを食べましょう!
そして CurryBu に投稿するのをお忘れなく ;P

新しい CurryBu をリリースしました!

こんにちは。お久しぶりです。

1 月 26 日、新しい CurryBu をリリースしました。

デザインのリニューアル

開発チームの @nasihsat さんの協力により、デザインをリニューアルしました。
部活動の日誌をイメージした手書き感のあるデザインになりました。

image

もちろん、モバイルのデザインもリニューアルしています。

image

ロゴや Favicon についても、今回、新たに作りなおしてもらいました。

活動記録

他の人や自分の活動記録がカレンダーで表示されます。
トップページには CurryBu 全体の投稿が、ユーザーページにはその人の投稿が表示されます。

image

「あの日は何のカレーを食べたのかな?」と思い出して楽しんでみてはいかがでしょうか?

また、活動記録に関連して「日ごとの投稿一覧」ページも作りました。
自分の食べた日には、他の人がどんなカレーを食べたのか、を見ることができます。

投稿ページ

画像のプレビューが表示されるようにしました。
また、カレーの種類、トッピング、タグなど、これまでコメントに書いていたものを一覧から選んで投稿できるようになりました。

マイページ

マイページを新しく作りました。
投稿数やいいね!した数、いいね!された数など、自分の活動を見ることができます。

マイページにアクセスした時に最初に表示されるものは「活動記録」タブです。カレーを食べた日によってカレンダーが表示されます。

image

投稿一覧」タブには、投稿したカレーが表示されます。

チェックした投稿」タブには、自分がいいね!したカレーが表示されます。

また、マイページの「設定を変更する」からプロフィールの設定を行うことができます。

ぜひ、好きなカレーの種類、こだわり、好きなトッピングを設定してみてください。

最後に

ぜひ、新しくなった CurryBu を使ってみてください!

今回のリニューアルについては、いくつか技術的なチャレンジもありました。内容については、後々開発ブログにも書こうと思っています。

また、ご意見やご感想などありましたら、Twitter やメールでいただけると嬉しいです。Facebook ページもよろしくお願いします!

今後も、新しい機能の追加やアプリの開発をしていきたいと思っています。

では、今年も CurryBu をよろしくお願いします! :)

お店の選択が簡単になりました

こんにちは。
最近、暑くなってきましたね。こんな日はカレーを食べましょう。

本日、カレーを投稿する時のお店の選択方法についての改善をリリースしました。

以前はセレクトボックスでお店を選ぶようになっていましたが、投稿ページで「お店を選ぶ」をクリックすると、モーダルが開くようになりました。

image

image

デフォルトでは、プロフィールに設定されている都道府県のカレー屋が表示されており、その他の都道府県でも絞り込むことができます。

都道府県が設定されていない場合は東京都として扱われますので、まだ設定されていない方は、この機会にこちらから設定してみてください。

都道府県で「すべて」を選択すると、登録されているすべてのカレー屋が表示されます。

image

また、お店の名前で絞り込むこともできます。例えば、「カリガリ」で絞り込んでみます。

image

選びたいお店をクリックすると、選択は完了です。

image

もし、お店が見つからなかった場合は、「お店を選ぶ」の上部にある「新しく登録」からお店を登録しましょう!

image

もちろん、今回紹介した機能は iPhone などのスマートフォンでも利用することができます。

ぜひ、お試しください!

CurryBu のドメインを変更しました

おはようございます。5 月に入ったというのに、涼しい朝ですね。

本日 5 月 2 日、CurryBu のドメインを currybu.in から currybu.com に変更しました。

4 月 30 日から currybu.in にアクセスできない状態が続いています。これはドメインwhois 情報を代理公開にしていたため、ドメインが停止されているためです。(関連リンク: 「.in」ドメインの一部で停止措置 whois情報の代行サービス利用が原因か - はてなブックマークニュース)

whois 情報を変更し、レジストリを通して停止解除申請を行っていますが、5 月 2 日 11:00 現在、停止解除は確認できていません。

そこで、今後のサービス運用も考え、CurryBu のドメインを currybu.com に変更することにしました。

ドメインについて

currybu.in が復旧され次第、currybu.in にアクセスすると currybu.com にリダイレクトされるようになります。currybu.in が有効である限り、リダイレクトは行われる予定です。

ドメイン指定受信設定について

currybu.in でドメイン指定受信設定をされている方は、お手数をおかけしますが、 currybu.com に変更をお願いします。CurryBu からのメールが受信できなくなります。

ブックマークについて

currybu.in でブックマークをされている方は、お手数をおかけしますが、currybu.com に変更をお願いします。

投稿データについて

ユーザー、投稿データの消失はありません。

Facebook ページについて

Facebook ページの URL は、ユーザーネームの変更が行えないため、旧ドメインのまま( https://www.facebook.com/currybu.in )となります。

他に質問などがありましたら、@CurryBu_ や info[at]currybu.com にお願いします。

ご迷惑をおかけして申し訳ありませんでした。
これからも、 CurryBu をよろしくお願いします!

「家カレー」ページをリリースしました!

こんにちは!今日も良いカレー日和ですね。

本日、「家カレー」ページをリリースしました。

これまでは、手作りカレーなどの家カレーを「お家」というお店に登録していましたが、「家カレー」というページに分けることにしました。

みんなの家カレー
http://currybu.com/items/homemade

「家カレー」ページには、ページ上部のメニューよりアクセスすることができます。

image

このページには「家カレー」として投稿されたものの一覧が表示されます。

image

家カレーを投稿するには、いつものように、ページ右上の「カレーを投稿」から投稿ページにアクセスします。

投稿ページの中で、「お店のカレー」か「家のカレー」かを選択することができます。

image

「家のカレー」を選択すると、「参考にしたレシピの URL」や「レシピのメモ」を書くことができます。

「参考にしたレシピの URL」や「レシピのメモ」を書くと、投稿ページでは以下のように表示されます。

image

なお、元々「お家」に投稿されていたカレーは、「家カレー」ページにデータを移行させて頂きました。

僕も早速、お土産で頂いた名古屋名物(?)のカレーきしめんを投稿してみました。

カレーきしめん @ 家カレー
http://currybu.com/items/299

ぜひ、皆さんの家カレーも見せてください!
楽しみにしています!