• Twitter
  • Facebook
  • Google+
  • RSS

Perlの自作フレームワークで作る、アジャイルなWebサービス



(※この記事は、リクルートメディアコミュニケーションズ提供によるPR記事です)

――今日はお時間ありがとうございます。はてなでチーフエンジニアをしている大西です。2001年、はてなの創業の年からはてなで働き始めて、はてなの開発を取りまとめてきました。今日は、3人のかたとお話しできるのですね。簡単に自己紹介していただけますでしょうか。
大石 はい、まず私から。RMCの大石と申します。もともとエンジニアだったのですが、今はエンジニアを束ねるマネージメントの仕事をしています。リクルートでのシステム開発は、SIerさんにお願いしてというやり方が多いですが、自社開発している部分もあります。今日は後者の自社開発の部分をお話ししたいです。
上田 RMCの上田です。1999年に入社してからずっとプログラムを書き続けてきました。30歳ごろにプロジェクトマネージャー職に進むのかという迷いがありましたが、それをふっきり(笑)、生涯プログラムを書き続けることにしました。入社以来、ずっとPerlを書いています。
神保 RMCの神保です。上田と同期で1999年入社です。ずっとエンジニアで、Perl一筋で、今もPerlを書いています。最近はフロントエンドに興味がでてきていて、JSをかじりつつ、Perlも書きつつという日々を過ごしています。役割は、上田みたいにガリガリと書くよりは、僕もキャリアパス的にマネジメント、プロマネ的なことをやりなさいといわれて(笑)
大石 いわれて?(笑)
神保 比較的やってはいるほうです。でも、自分で書くことも忘れたくないなあと思います。

ワンポイント用語集

SIer - システムインテグレーターのことで、情報システム開発を請け負う企業。「えすあいやー」と発音する。
JS - JavaScriptのこと。Webブラウザ上などで動作するプログラミング言語、またはその処理系。

■ 自社フレームワーク開発に至る道のり

――マネージャさんお一人と、エンジニアさんお二人ですね。まずは最近のお仕事を教えていただけますか?
上田 はい、2009年にリクルート メディアテクノロジーラボ(以下MTL)がリリースした「クレイル」というサービスがあります。

上田 まずはSNSを中心としたサイトを作るってことを試行錯誤しながらやってみたという感じです。で、2010年くらいから、このクレイルを、リクルートのほかの事業案件、例えばホットペッパーや、SUUMOに応用していけないかという試みが始まりました。

神保 クレイルという名称は、「クレイル」ってサービスを指すこともあるんですけれども、今のRMCのエンジニアは、Webアプリケーションを作るためのフレームワークとして認識することが多いです。
――なるほど。MTLが開発した“初代クレイル”が進化して、今では社内フレームワークとして案件を実現するのに利用されているのですね。これらは全部Perlなんですか?
上田 はい、Perlです。そもそも川崎さんがリクルートにいたからっていうのがたぶん一番大きいと思います。HTTP::Engineが出始めて、これを利用して純国産のフレームワークを作りたいっていう川崎さんの野望から、フレームワークができたと聞いています。
――HTTP::Engineというと、2008年のおわりごろから、あーなるほど、そうですね。
上田 川崎さんたちが作った「クレイル1」が、現在のhttp://creyle.jp上で利用されています。2010年ごろから事業展開し始めた今のクレイルは「クレイル2」と呼んでいます。ここからRMCがクレイルの開発に参加しています。クレイル1は増改築の結果、パフォーマンスに問題が出ていたので、ちょうど出始めたPlackを使ってゼロベースで開発しました。
――このフレームワークで今開発している開発者のかたって何人くらいいて、どんな案件があるんでしょうか。
大石 開発者は20人くらいですね。
上田 案件別でいうと、SUUMO、パチパチゼクシィ、お店のミカタ、半額ネット…

神保 たくさんのプロジェクトがクレイル2で動いています。このフレームワークのコアの部分を管理しているのは2、3人です。メインが上田です。

ワンポイント用語集

川崎さん - 川崎有亮さんのこと。リクルート メディアテクノロジーラボ チーフアーキテクト。Web開発における講演や著書が多数。 http://www.kawa.net/xp/index-j.html
HTTP::Engine - Perl向けWebアプリケーションフレームワークのためのフレームワーク。Webアプリケーションフレームワークの実装を簡単にする。
Plack - WebサーバーとWebアプリケーションのインタフェース仕様PSGI(Perl Web Server Gateway Interface Specification)のリファレンス実装。

■ クレイルと「Waffle」の実際

――事前にちょっとお聞きしていた通り、はてなの開発にとても似ていますね。とくに、自社開発のWebアプリケーションフレームワークがあって、いろいろなサービスからつかっているところです。お聞きしたいポイントがたくさんありますが、まずはどんなフレームワークかを教えていただけますか。
上田 はい、ちょっと階層図を書きますね。

上田 Apacheがいて、FCGIがあって、
――お、Apacheなんですね。
上田 はい、リクルートにはいろいろと決まりがありまして。で、FCGIの上にPlackがいて、その上に「Waffle」というオリジナルのWebアプリケーションフレームワークがあります。
神保 Web Applicattion Framework For creyLEの略でWaffleです。
――このWaffleまでが汎用ってことなんですよね。
上田 そうです。で、Waffleの上はPerlの世界です。この中にまた3階層くらいあって、基本的にはMVCになっています。Mを担うORMはDBICで、ViewのエンジンはTTを使っています。個人的にTTは好きじゃないので、Text::MicroTemplateとか使ってみたかったんですが、反対意見も出たのでやめました(笑)。
神保 最初TTも「自分でテンプレートエンジン書き直す!」っていってたんですけど、エンジニアの人材を集めるときも、TTのようにある程度一般的な技術のほうがやりやすいので、妥協してもらいました。
――たしかにTTは速度など気になるところがありますもんね。
上田 どうにも気になるエスケープ漏れは、「|html」をつけないとエラーになるようなパッチをちょっとあてました(笑)。 ただ、Waffleはクレイル2のほんの一部です。単にHTTPリクエストをさばくためのフロントエンドで、ビジネスロジックはほとんど持っていません。クレイル2の本質は、その名の通りCreyle2.pmってのがありまして、これが

  • サービスクラスの呼び出し
  • データベースへのアクセス
  • 環境ごとの設定
  • 認証や画像のアップローダなど内部ASPサーバーへのAPI呼び出し
  • ファイルのアクセスや、OSのコマンド実行など、OSとのやりとり

といった重要な機能を備えています。クレイル共通のコンポーネント的にしてあって、Webからもバッチからも利用できます。

ワンポイント用語集

Apache - Webサーバーソフト。http://httpd.apache.org/
FCGI - FastCGIのこと。CGIプログラムのプロセスをメモリー上に永続化させることで、その起動/終了時のオーバーヘッドをなくすための拡張。http://www.fastcgi.com/drupal/
MVC - ソフトウエアのアーキテクチャ。データと手続きを扱うModel、見た目を扱うView、ユーザーの入力を処理するControllerの三つの頭文字からなる。
DBIC - DBIx::Class。Perlで実装されたO/Rマッピングライブラリ。
TT - Template::Toolkitのこと。Perl向けのテンプレート処理システム。PerlでのWebアプリケーション開発で、MVCのViewを担う目的でよく利用される。
Text::MicroTemplate - シンプルで軽い、Perl向けのテンプレート処理システム。

■ クレイル2の特徴は、強力なモデルクラス

――DBICはそのままつかっている感じなのでしょうか。
上田 いいえ、サービスクラスが別にあって、そこを経由してデータベースを操作します。あるテーブルに対するCRUDの単位でpmを作って、createだ、updateだ、searchだ、っていう引数で呼び出して戻り値があるって仕組みにしてしまいます。それをAPIとして提供します。コントローラから直接DBICを触ろうとするとエラーして終了になるように実装しています。
――なるほど。DBICにラッパーをかぶせて強力なモデルクラスとしているんですね。
上田 そうです。Waffleの仕組みとして、pmとして、メソッドを1個増やすと、それがAPIになるという。
――そうすると、ビジネスロジックはこのサービスクラスにほとんど押し込めるのですね。テストが書きやすくなりそう。
上田 はい。サービスクラスの中にビジネスロジックを書いて、そこにテストも書いていく。そうすると、コントローラやビューは、たいした仕事をしないので、そこはそう念入りにテストしなくていいだろうというのが、Waffleでの正規の開発手順です。
神保 (実際にWaffleで開発していて)すっきりはしていると思います。よくありがちなのは、コントローラだったり、モデルだったりにビジネスロジックが出入りして、テストし辛くなることです。この仕組みだとそういう問題は起こらない。モデルっていってしまうとDBICともからみがでてくるんですけど、そことも切り離して、MVCじゃなくてもう1個サービスってところを作って、ビジネスロジックは全部そこにってしたんで。
――そのサービスクラスの単位って常にテーブルなんですか?
神保 テーブル単位のときもあるし、そうじゃないときもあります。

上田 原則はテーブル単位です。でも親子でテーブルをまたぐようなときは、親の名前で呼び出して、引数で子供の配列を持たせるようなことをすることがあります。
――複数のテーブルにからむ情報をまとめて、1個のサービスクラスにするとかですね。
上田 そうですね。クレイル2を始めるときに「いろいろなバックエンドがAPIでつながっていて、切り貼り自由」という絵をだれかが書いて、それが設計思想になっています。JSアプリやiPhoneアプリもAPIでサクッと作れるようにと。実際、サービスクラスを作成すると、それがそのままWeb APIとして公開される機能がWaffleにあります。なので、関数型の、呼んだら戻り値があるというAPIをイメージしたサービスクラスになりました。でも、困ることもあります。例えば、ビューで、あるコード値を名称に変換するということがすごくやりにくい。普通はORMにメソッド生やせば済む話が、API前提ってことは……
――ああそうかあ。コード値と名称で別のメソッドになるか、引数で切り分けるか。
上田 そうです。一応、汎用のコード変換APIを作って逃げました。他にも、API前提なので引数と戻り値にオブジェクトを渡せなかったり、引数のバリデーションを都度書かないといけなかったり、トランザクションの単位に気をつかったりといった問題があります。個人的には「なんでもAPI」には懐疑的で、RailsのActive Recordみたいに、ORMをひたすら充実させるほうが好きです。
神保 全部Perlで書くとそういう気持ちになることはたしかにあります。でも、ビジネスロジックを含む操作がすべてAPIになってることで、コントローラとビューの部分は、別の言語で書いてもいけるってことですよね。
――そこが疎になっているのはすごいいいですね。
神保 という想定だったんですけど、現実的にはほとんど全部Perlで書いちゃってる(笑)。役に立っているところは、ご指摘の通りテストが書きやすいところでしょうか。
――フレームワークとして、開発効率を上げるような仕掛けは他にありますか?
上田 あー、Migrationもどきを作りました。
――ALTER TABLEですね。
上田 まあ、たいしたものじゃなくて、DBICのモデルから最初のCREATE文は自動で吐いてくれます。それ以降のALTER文は手作りでリポジトリに追加してます。ソースを最新化してmigrateコマンドを流すと、DBの定義が最新化されます。開発環境が各自のPC上のVMなので、それに対応しただけです。本番リリースにも使えます。
神保 ひな形生成機能も強力です。
上田 Railsでいうscaffoldみたいな機能があって、会員登録とか、認証とか、Webサービスで必要な基本的な機能はすべてひな形があります。用途があっている場合は、素早く開発できます。用途に合っていない機能は間引いていくって作業が発生はしますが。
神保 毎度書くよりは消すほうがはるかに簡単です。

ワンポイント用語集

CRUD - データベース管理システムに必要な4つの機能。Create(生成)、Read(読み取り)、Update(更新)、Delete(削除)の略。
pm - Perl Moduleの略。Perlでコードを再利用する単位。拡張子が「.pm」であることから「ぴーえむ」と呼ぶPerlエンジニアが多い。
API - Application Programming Interfaceの略。プログラムがプログラムを利用するときのインタフェース。
Migration - ここでは、Ruby on Railsにおけるデータベーススキーマの変更の意味。
ALTER TABLE - データベース管理システムで、データベースのスキーマを変更するSQL文のこと。
Rails - Ruby on Railsという、RubyのWebアプリケーションフレームワークのこと。http://rubyonrails.org/
Active Record - Ruby での O/R マッピングライブラリ。Ruby on Railsで利用される。
scaffold - 「足場」などの意味を持つ英単語。Ruby on Railsでは、アプリケーションのひな形を意味する。Ruby on Railsは、ひな形を自動的に生成する機能を備えている。

■ なぜフレームワークを自作するのか

――面白い設計思想で、使いやすそうなフレームワークですね。自作するフレームワークを社内で作って使うメリットと、そうではなく既存のありものを使うのと、どういうふうにお考えですか?
上田 うーんと、僕の目の届く範囲外には持って行こうという気はなくて、自分でコントロールできるのでっていう意味で、自分の業務の中だけでずっとやってます
――あーそれはすごいわかります。知らない人が作っているフレームワークを使っていると、わからない進化をしていったり、ついていけなくなったり、非互換な変更をされたりみたいなことがありますよね。自社で開発していて、自分で(フレームワークの)リリースをコントロールできる状態にしていると、互換性を保ったまま、この機能を追加するみたいなことがしやすい。
上田 そうです。ただその、オレオレのジレンマはずっとあります。なんとか流行らしたいな。
――オープンソースで世に出したいと。
上田 そうです。そしたらオレオレじゃないよっていいたいところなんですけどね。
――まだ出されていないんですか?
上田 はい。2004年、2005年くらいに、世に出すつもりで作っていたものがあって、それは構想から崩れたんで、あるサービスで現在使ってはいるものの、それを広める気はもうありません。実は2008年ごろは、Railsでいいんじゃないかと思っていました。Perlってすぐメモリーリークするじゃないですか。
――はい。
上田 だからWeb向きの言語じゃないってずっと思っていて、Rubyでいいじゃんと思っていました。でも、最近Rails 3に触る機会があったときに、すごく“太って”いて、重いなって感じて。Perlで新しく“軽さ”を売りにしたフレームワークって作るのはアリじゃないかなあと思ったり。
――RubyでSinatraみたいな軽い方向の流れはありますよね。多機能で分厚くて重いのと、薄くて軽いのがあって、分厚くて重い方向が主流。
上田 なんでああなっちゃうんでしょうね(笑)
――今だと、Webアプリケーションフレームワークは薄くして、クライアントからのリクエストをきちんとルーティングしてくれればいいやみたいな感じが僕はあります。
上田 はい、結局、リクエストを受け取って、正しいクラスに渡してって部分が中心だと思っています。

ワンポイント用語集

メモリーリーク - プログラムが実行中に使用したメモリー領域を開放せずに、メモリー消費量が増えていく現象のこと。サーバー向けプログラムのように、長時間動作するプログラムで問題になりやすい。
Sinatra - Rubyの軽量Webアプリケーションフレームワーク。 http://www.sinatrarb.com/

■ いろいろと自由なRMCの開発環境

――先ほど、Railsにするかもと思いながらPerlに戻ってきたというお話がありました。言語がPerlじゃなくてもかまわないというのは、会社的には大丈夫なんですか?
大石 この会社は、一定のルールはありますが、利用する言語は決まっていないです。サービスに適した開発言語を選択するという文化です。
――では、結構バラバラなんですか?
大石 例えば、堅牢なシステムとか、人員的にスケールが求められるなどの制約で言語が限られる場合もありますが、特にスタートアップフェーズでは様々な言語が使われていますね。たまたま僕らはPerlが得意なエンジニアが多かったんで、Perlになっています。
――社内の言語のシェアってどんな感じでしょうか。
大石 リクルート社内でいうと、基本的には自社開発するよりも、協力会社さん、ベンダーさんに開発をお願いすることが多いのでJavaが多いです。携帯向けだとPHPがメインだったり。
神保 Javaと、PHP、ほかにRailsがちょこっとあって。内製しているところは、古くからいるエンジニアがPerlばっかりなんで、そのせいもあってPerlが多いです。
――若いエンジニアから「Rubyにしましょう!」っていわれることはないですか?

上田 ないですね。
神保 上田は言語にあんまりこだわりないよね。
上田 ないっちゃないね。
――開発環境ってどんな感じですか?
上田 みんなVMを持っていて、そこにMySQL入れています。
神保 ほとんどMacです。MacでVMware。エディタはVimが多いですね。
――みんなVimなんですか。私はEmacsなんですが……
神保 Emacsは聞いたことがないですね。そういえば上田は秀丸です。
上田 秀丸がすごいのは、どんなに機能アップしても軽快さを失わないことです。ほんとはWindowsから離れたいけど、秀丸のためだけに離れられない…
――エディタ論争は果てしないのでやめましょう(笑)。Macでもネイティブじゃなくて、VMで開発環境作られてるんですね。
上田 Macネイティブはだれかがはまっていました。
――弊社もMacネイティブで最初は何人かはまっていたんですけど、だんだんはまりが解決されてきたんで、みんなMacに流れてきました。
上田 ほー。
――PerlのバージョンやOSは決めていますか?
上田 Perlは5.8.9ですね。
神保 OSはCentOSです。
――おお、はてなと同じですね。いつでも転職できそうです(笑)

ワンポイント用語集

VM - 仮想マシン(Virtual Machine)のこと。
VMware - VMware社が提供する仮想マシンソフト。 http://www.vmware.com/jp/

■ 少人数のチームでアジャイルに

――急に転職を意識したわけではないんですが(笑)、普段どういう開発をされているかの質問をいくつかさせてください。
大石 はい(笑)
――開発は、何人くらいのチームで、どういう構成でやっているかを教えていただけますか?
神保 2人から4人くらいのチームが多いですね。
――デザイナーさんは?
上田 外部の人です。デザインをお願いすると、HTMLとして納品してくれるんで、それをTTに書き換えます。
神保 マークアップ専門のエンジニアはいません。プログラマがTTを書いています。
――弊社は社内にデザイナがいて、デザイナがTTを触るようになってきています。
上田 あーそれは楽そうですね。
――いい点はたくさんあります。例えば本番のデータベースに接続して、生のデータを見ながらデザインを調整していけることです。一方、TTを覚えないといけないとか、デザイン専門で入ったかたが、なぜかLinuxのコマンドをバリバリ覚えて、gitにコミットするとか、そういう不思議さはあります(笑)
上田神保 (笑)
大石 サービスの企画そのものは、リクルートのメンバーが企画することが多いです。そこで新しいサービスに興味がある人が手を挙げて、一緒にやっていく。

――企画の根っこはだれかが立てられて、そのあと開発の過程でエンジニアは、どのくらい意見をいったりすんでしょうか。
神保 壁はあんまりないですね。かなり自由です。プランナに言われるがままってわけではないし、エンジニアがプランナの意見を無視して勝手に実装するようなこともないですし。
――ミーティングとかどうしてるんでしょう。
大石 お店のミカタのときは、もう隣りにいて、「これできる?」「こうしたらいいんじゃない」みたいな会話を普通にしていました。
――情報共有につかっているツールはありますか?
神保 Backlogをつかっています。(http://www.backlog.jp/
上田 Tracみたいな。見た目がちょっとポップなんで、プランナのかたでも使いやすいです。
神保 SVNのリポジトリもくっついてくるんで。
――おお、それは便利ですね。このチケットの修正はこのコミットみたいな。
神保 すべてそこまで厳密にはやっていないです。たんなる備忘録の人もいれば、自分のToDoをガンガン入れて徹底的に管理している人もいれば。ほかのエンジニアの人にタスクをふるときに使うこともあります。
上田 破たんはしてない感じですねえ。
神保 となりにいるのが一番大事で、直接会話をすることで、コミュニケーションに必要なかなりの部分を担保できていると思います。
―― 開発フローってきっちりされている感じなんですか?
大石 リクルートの従来のやり方でいえば、ウォーターフォールでプロジェクト管理をちゃんとやっています。その中で、僕らはサービスの特性によって開発手法も切り替えればよいと考えています。さっきいっていたゆるやかなルールの中でやる。品質高くやるというよりは、求められるのは対応力だったり、スピードだったり。そのときはこういうやりかたがいいんだろうなあ、と。
――おお、アジャイルですねえ。そういえば京都からおみやげをお持ちしたのでした。アジャイル餅ではなくて、あじゃり餅というお菓子があります。
上田 これおいしいですね。食感がいいです。
大石 アジャイル餅……。

ワンポイント用語集

Trac - バグトラッキングとプロジェクト管理のためのツール。 http://trac.edgewall.org/
SVN - Subversionの略。集中型ソースコード管理システム。 http://subversion.apache.org/

■ スピードを重視するための自由

――会社の規模のわりにずいぶん自由な開発をしている印象を受けます。
大石 そうですね。素早い開発を意識してやっていることは多々あります。もちろんウォーターフォールできっちり作ることを求められるものもありますが、そうでないものは、速く作って、速くフィードバックを受けるようにしています。リクルートもかわってきてて、速く出して、リリースして、ブラッシュアップしていけばいいやという流れになってきています。
上田 自由さには助かってます。ここ2、3年で、ずいぶん過ごしやすい環境になってきた(笑)

神保 基本的にはデザイナさんからHTMLが来てから開発が始まるのですが、どこでもできるし、実際どこでも書いています。上田はエレベータの中でコードを書いていた伝説もあります(笑)
上田 エレベータの中で書いたのはVAIO Uにはまっていた時代ね(笑)
神保 朝は10時ぐらいに出社しています。フリーアドレスなんですけれど、だいたいみんな仕事しやすいような配置がなんとなく決まっていて。プロジェクトが始まったり終わったりで、自然と配置換えが発生する。
大石 プランナの人が机上で一生懸命考えてもうまくいかないってことを、なんどか目の当たりにして、だんだんそういう風になってきました。少なくとも、スピード感を持ってものを作り、早いタイミングでフィードバックを受けて、インクリメンタルに開発を進めるってことではうまくいってきていると思います。自社でフレームワークを開発している理由も、そこに投資することがビジネスに直結しているのでできる。そのために必要な環境を整えるのも仕事です。
上田 おかげで楽しく作れています。

■ 「自ら機会を創り出し、機会によって自らを変えよ」

――RMCで働くエンジニアを募集中とお聞きしました。
大石 はい、一緒に働いてくれる社員を募集しています。
――どんな人が好ましいのでしょうか。
神保 PerlのWebアプリケーションフレームワークを使ったことがあって、一通り開発経験があれば、2週間くらいで普通の仕事はできると思います。
上田 欲を言うと、ありものを使っていただけの人よりは、自分で作れる人だとうれしいです。お仕着せをするつもりはまったくなくて、議論をした結果、いけてるアイディアが勝つだけです。例えばフレームワークなら、フレームワーク自体の機能をどこまで理解できるかみたいな人と一緒に働けたら楽しいなあと思います。
神保 楽しんでやれないと辛いですよね。
上田 こういうと引かれることもあるんですけど、たまに、自分のコードを見て感動するんですよ。だれにも理解されないし、お金にもならないんですけど、そういうところに想いを持ちたいし、同じように想える人がいたら。
大石 ハッカー気質がある人を求めています。この会社は、わりとなんでもできます。プログラムを書き続けたいと思えばそうできるし、フレームワークを作りたいと思えばそうできる。アイディアを考えて、みんなに伝えて、お金になるって思えたらその通りに進められます。そういう、自ら手を挙げて、これをやりたいと説得できれば、やってよい文化があります。もちろん、自分の責任で最後までやり切ることもセットですけどね。
神保 いろいろな人種がいるので、いろいろな仕事のしかたがあります。マネージャに進化していくエンジニアもいれば、プランナだったり、インフラだったり。私は技術的にはフロントエンドに興味を持っています。その意味では好きなことをやれて幸せです。
大石 リクルートの昔の社訓で「自ら機会を創り出し、機会によって自らを変えよ」というのがあります。今はなくなっちゃったんですけど、そういう思いの人なら、自分で見て、判断して、それで手を動かすってことを幸せに思える人なら、楽しい仕事ができるのではないかと思います。


エンジニア募集のお知らせ

リクルートメディアコミュニケーションズは、エンジニアを募集しています。「7000時間以上のプログラミング経験」など気になる募集内容は、リクナビNEXTの以下のページでご確認ください。

■ この記事をブックマークしてプレゼントに応募

※キャンペーンは終了しました。たくさんのご応募、ありがとうございました。

記事中でも登場したように、最近のWebエンジニアが愛用するパソコンはMacです。今回はMacBook Airの以下のモデルを抽選で1名様にプレゼント。応募方法の詳細は以下の応募要項をご覧ください。

Apple MacBook Air 1.4GHz Core 2 Duo/11.6

Apple MacBook Air 1.4GHz Core 2 Duo/11.6"/2G/128G/802.11n/BT/Mini DisplayPort MC506J/A

応募要項

  • 応募期間
    • 2011年3月28日(月)から2011年4月10日(日)24時まで
  • 賞品と当選人数
    • アップル社製「MacBook Air 11インチ」(MC506J/A)を1名様
  • 応募方法
    • この記事をはてなブックマークに追加
    • ※プライベートモードでご利用の方は対象となりません
  • 当選発表
    • はてなブックマーク日記にて告知します
  • 賞品発送
    • 当選発表後、はてなよりメールをお送りし、送付先情報(送付先住所、受取人氏名、電話番号)をお聞きします

文: 青宮しおり