お雑煮ぐらむを作った話

お雑煮ぐらむという、京都のお雑煮をただひたすら眺められるギャラリーサイトを作った。

京都のお雑煮

日本国民の殆どが年始に食べる料理、お雑煮。
意外と地域によって特色がある。

デファクトはおすましだけど、地域によっては合わせ味噌を使うところや小豆を使うところもある。
トッピングも色々あって、鰤やらいくらやら牡蠣を乗せたりもするらしい。
沖縄ではお雑煮文化が無くて、代わりに中身汁という食べ物が出たりするらしい。

さて、京都のお雑煮はと言うと白味噌をベースにお餅を入れて鰹節をふりかけたものだ。
外側がカリッと焼けた丸餅に、濃厚な白味噌をジュワァと染み込ませて食べるのがなんとも言えないくらい美味しい。

Pちゃんさん(@p1ch_jp)が投稿した写真 -

年賀サイト

話は変わって、ぼくのバイト先であるFICC KYOTOでは毎年お正月に、HAPPY NEW YEARコンテンツを作っている。
と言っても、2014年しか作っていない。というのも2015年のHAPPY NEW YEARコンテンツは、ぼくが作るはずだったのだけど、色々あって作らず終いだったのだ。
何もアイデアが思い浮かばず、通常業務をやったりで気付いた時には年末だったので「HAPPY NEW YEあっ...」ってなって終わった。

そんなこんなで今年は何か作ろうと思って、京都らしいお正月ってことで白味噌のお雑煮のギャラリーサイトを作った。
結局、主要なところは大晦日と正月の午前中の約1日で作って、正月のお昼頃に公開した。
機能は至ってシンプル、無限スクロールで次々とお雑煮の画像が見れるだけ。

実装

超シンプルな機能のわりには、結構大変なことしてる。
今回、お雑煮ぐらむで取り上げている写真はInstagramの「#お雑煮」と「#白味噌」の両方のタグが付けられた写真だ。
しかし、InstagramのAPIには複数タグから写真を引っ張ってくるエンドポイントは存在しない。
そのため、一度「#お雑煮」タグの付いた画像を全て引っ張ってきてデータベースに格納。
そこから、「#白味噌」タグが付いた画像を検索、ソートして出力するようにしてる。
そして、データベースを常に最新に保つためにcronをまわして20秒に1回、新しい画像が無いかを探しにいったりしてる。
InstagramのAPIは1時間に5000リクエストまで許してくれる太っ腹なので、制限を気にすること無くガンガンcronまわせる。
機能の割には手間暇かかって大変だった。

あと超今更感あるけど、初めてCSSで縦書きのプロパティを使った。意外とあっさり出来てビックリした。
昔は竹取.jsを使わないとまともに縦書き対応出来なかったのに、いつの間にかCSSもデキる子になったのね...(と言うより、各ブラウザが対応頑張った感じなのかな)

読み込みが遅い

ただでさえ重い画像コンテンツなのに、非同期読み込みに対応していない、データベースは無料の海外インスタンスのやつなので検索遅い、おまけにアプリのホスティングがRaspberryPiである。
初めての読み込みには平気で10秒とか20秒とかかかって笑うしかない。新年明けたばっかだし、笑いながらお待ちいただけると幸いです。

あとリロードしまくったら、RaspberryPiが悲鳴あげて即死する気がするのでお手柔らかにアクセス願います。

画像が消去された場合

データベースに格納したあとに、画像が消されると、404の画像がそのまま出力されてしまって残念な感じになる。
これはなんとかして対応したいけど、実装の優先順位的に低かったので後回しになっている。

余計な話

今回お雑煮のデータを集めまくった結果、約2万件のお雑煮データが集まった。
「うはwwwこれが噂のビッグデータwww」って思って、頻出タグの解析とかをやってみた。
お雑煮を食ってる時の感情とか傾向とか浮かび上がってくるかなと思ったけど、何も出てこなかったので残念。(解析方法が雑過ぎただけ説もある)
結局、Instagramはお洒落な写真が流れてきて、それをダラダラ見られることにこそ価値があるSNSのような気がした。


お雑煮ぐらむ - http://ozouni.p1ch.jp