社長BLOG

OpenPNEはドキュメントが充実していないといわれて久しい。

OpenPNE3からは、コアフレームワークをsymfonyにしたことで、基礎部分のドキュメントは不要になった。

ただ、OpenPNE独自に開発した部分やOpenPNEを使って、ただSNSを運営したい、というニーズにはまだまだ答えられていない。ドキュメントも進歩させたい。

Ver2時代の資料の取り扱い

OpenPNE公式WEB http://www.openpne.jpのドキュメントはかなり古くなってしまっている。
まず、バージョン２時代の情報を取り下げ、公式サイトの情報をVer3前提のドキュメントにアップデートする。

取り扱う情報としては

・環境構築、ダウンロードからインストールまでの説明
・OpenPNEの開発情報（特にスマートフォンAPIを使った拡張方法）

この２点に絞って、資料を充実させたい。その他の資料はサイトから取り除く。

技術サポートサービスからのフィードバック

先日、OpenPNEの技術サポートサービスをリニューアルした。
専任の担当者もついて、各種マニュアルやOpenPNEの開発ガイドなどの情報を充実させている。

こちらの成果を、OpenPNEプロジェクトにフィードバックすることでサイトを充実させる。

公式SNS

公式SNS内のコミュニティ掲示板は、ドキュメントが少ない中での貴重な情報源である。
素晴らしいコミュニティサポートが提供されている。（感謝）

こちらも旧バージョンとバージョン3のサポートに掲示板を分け、運営することにする。

バージョン3の掲示板の内容は非公開とせず、インターネット上に共有する。
※投稿は、これまでどおり公式SNSのアカウントが必要。

少しでもOpenPNEの運用情報にアクセスしやすくなるようにしたい。
こちらはすでにバージョン3用のコミュニティが動き始めたので、これを起点にサポートを続けていく。

HOUOUでは開発が精一杯の状況で正直それほど余裕が無いのだが、ドキュメントも進歩させていきたい。

OpenPNE開発版の目標は「生地がうまいプレーンなピザ」

ピザの上にいろんなトッピングをして美味しく食べることができる。

もちろんそのまま食べてもおいしい。

シンプルな味付け。
スピーディに焼ける。
スマートなイメージ。

プレーンなピザに合うトッピングとして、タイムライン機能を
「ゴルゴンハニー」というコードネームで作成している。

今のOpenPNEはまだまだシンプルではない。

今日気になったのは、開発者向けの機能。

一般のSNS運営者が使わないような開発者向けの機能が、山のようにビルトインされている。

例えばOpenPNEのインストール、バージョンアップ、プラグインのインストールに使うsymfonyコマンド。

デフォルトで1画面におさまりきれない量のコマンドが出現する。
運営者が使うのはこの中のせいぜい10個程度。
symfonyコマンドでよくわからない英語が、ズラーッと並んでくるだけでも、ビビってしまう。

大量の使わないコマンド群は、運営者にとってはノイズとなる。
これは隠蔽したい。

開発者モードをセットすると、隠されていたコマンド群が出現する。というような機構を備えようと思う。
見栄えとして隠蔽するだけなら、HOUOUシリーズの中でも実現できるんじゃないかと思う。

いずれ開発者プラグインをつくる

今後はsymfonyの高度なプラグイン機構を活かして、opDeveloperPluginをつくり、
開発者向け要素はこちら側に移動することで、運営者の利用をもっとシンプルにすることはできないだろうか？

運営者はそのまま使う。開発者は開発者プラグインを導入して使う。
または、運営者向けに、開発要素の含まれていないビルド済みのシンプルなパッケージを提供する方向性もあるかも。

TravisはOpenPNEの進歩に役立ってくれると直感し、対応をすすめている。

とりあえずOpenPNEの本体、プラグイン単体の両方でテストができるようになった。

OpenPNE本体の自動テスト

このブランチが自動テストに対応している。
https://github.com/houou/HOUOU/tree/tjm/apitest

プラグイン単体のテスト

opSheet2ProfilePluginを試しに対応してみた。
https://github.com/tejima/opSheet2ProfilePlugin

プラグイン単体の方はかなりトリッキーで、次のような手順で無理やりテストしている。

・プラグインのコミットをgithubにPushする
・Travisが自動的にコミットされたソースを取得する
・テスト前の設定スクリプトでOpenPNE本体を取得し/vender/OpenPNEに展開
・/vender/OpenPNE/plugins/opSheet2ProfilePlugin ディレクトリをつくり、そこにソースを移動する
・OpenPNEをインストール
・プラグインのテストプログラムを実行する

これでうまく行った。

これでOpenPNEとOpenPNEプラグインを毎回コミット単位で、継続的テストにかけることができるようになった。

自動テストの今後

スマートフォンWEBクライアントのJavaScriptをテストできるようにしたい。

SeleniumもTravisで自動テストできるようにしたい。

テストデータをもっと洗練させたい。

プラグインのテストをもっと手軽にできるようにしたい。

3月からOpenPNEのテストに取り組んでいくのだが、テストデータの扱いに困った。

OpenPNE3.6までのテストではテスト用に専用のデータを作っている。
A B C D Eというニックネームのユーザーがいて、Aというコミュニティがあって、

というようなデータを作ってテストをしている。

これは分かりにくいしつまらない。

テストを最小限のコストで実行するためにはやむを得ないと思うけど、
開発者みんなの頭の中でデータ構造を覚えていないから、テストの品質を考えてベストじゃないと思う。

みんなが共有できて、魅力的なテストデータをつくろうと考えた。

テストデータをテストの時だけ使うのではなく、予めデータの入ったインストールも試せるような
OpenPNEのデモンストレーションモードとして作れば、力もかけられるし一石二鳥だ。

百人一首で決まり

最初は「世界がもし100人の村だったら」でつくろうと考えた。
次にアイデアがでたのは、女性をAKB48から、男性をEXILEから持ってくるというアイデア。
ただこれは、誰がどのメンバーIDだかがわからないし、AKBとEXILEをフレンドリンクさせると、それはそれで問題があるんじゃないか？ということで却下。

最終的には、100人ぴったりで、ナンバリングできるし、名前もついてるし、「公家」「坊主」「武士」コミュニティに所属させたりするのも楽だし、英語化もされている、ということで、百人一首に決まった。

OpenPNE3.8にはデモンストレーションモードとして、百人一首の世界が再現される。
管理者は「天智天皇」だ。このデモでは天智天皇から招待状が届くことになる。

※追記 サンプルのたたき台ができた。
https://github.com/tejima/opSheet2ProfilePlugin/blob/master/test/fixtures/common/100data.yml

お気に入りの素晴らしいサービス。Dropboxがボーナスキャンペーンを行っている。
新機能のベータテストに参加することで、5GBもボーナスがもらえる。

１．登録
まずはアカウント登録。http://db.tt/pwX9paJ

無料の2GBに加えて、登録ボーナス250MBが紹介者と利用者に入る。

２．専用クライアントでβテストに参加

Windows: http://dl-web.dropbox.com/u/17/Dropbox%201.3.14.exe
Mac OS X: http://dl-web.dropbox.com/u/17/Dropbox%201.3.14.dmg

専用クライアントをダウンロードして、ベータテストに参加する。

３．写真をUP
とにかくひたすら写真をとって、接続してDropboxにアップする。
300MBづつくらいのムービーを撮り続けてアップするのがオススメ。

４．ボーナスをもらう
500MBアップロードする度に、500MBのボーナスがもらえる。

11GBまでボーナスを獲得した。

ユーザーとして楽しいサービスは、とても素晴らしい。
OpenPNEのサービス提供でも見習いたい。

段取りについて列挙。

スマートフォンをHTML5Validにする
マージ作業の前にタグとして正しい状態をつくる

hououの成果をOpenPNE本線にマージする
スマートフォンAPI、スマートフォンアクション、その他hououで行った修正を本線にマージする。
以後OpenPNEの基本開発スタイルに沿って進める。

２つのプラグインをOpenPNEパッケージに加える
メッセージ機能と、日記、もしくはトピック機能を対象とする。
パッケージに加える基準に引き上げるためにスマートフォン化する。

スマートフォンHTML構造を改善する
HTMLタグ付けの見直し、CSSの共通化。

スマートフォンのテーマをデザインする
現在デザインなしで、グレースケールで作っているテーマをデザインする。

国際化対応する
HOUOUプロジェクトで開発した部分を国際化対応する。

シンプル化をもっと進める
アクティブでない機能を隠す。
分かりにくい部分のもっと取り除く。

スピード化をもっと進める
・スマートフォンAPI READ部分のDoctrine外しは実現する。

リリースQA
リリース用のQA作業。
３月はQA祭り。

いつも当たり前のように

./symfony openpne:install コマンドを走らせてOpenPNEをインストールするが、いまいち馴染みにくい。
ここで入力した設定ファイルはどこに格納されるのか？（ /config/databases.yml なんだけど ）

ymlはばれる

またymlファイルは、レンタルサーバに置いたとき、うまく階層構造を隠蔽しないと、データベースのパスワードがバレてしまう心配がある。

プロジェクトとして、この警告を行っていないのは問題だ。

※ちなみにとりあえずの対策としては /config/ディレクトリ以下に .htaccessファイルを作成し、

<Files “databases.yml”>
deny from all
</Files>

このように記述する。ブラウザからアクセスしてみてアクセスが拒否されればOK。
これでだめだったら一旦サイトは停止して対策したほうがいい。

ymlはミスる

ymlの書式は覚えてしまえば簡単なのだが、全く初見のエンドユーザーにとってはミスが起きる原因になるかもしれない。
自分もタブとスペースの使い方を間違えた。広く使ってもらうためには、古いスタイルだがconfig.phpがベストだ。

改善

symfonyではymlファイルの中にphpを埋め込めるそうだ。
config.phpでグローバルに設定した値を、databases.ymlから読み込むようにすればいいんじゃないか。
その他の設定値も、大事なものだけをconfig.phpにまとめて格納し、その他の設定ファイルはなるべく隠蔽させたほうが分かりやすい。

HOUOUの開発系ではできないだろうけど、思いついてしまったので共有しておく。

現在開発中のOpenPNEのスマートフォン対応の方法について解説する。

全体構造

スマートフォンでは、ガラケーと違ってHTML5,CSS,JavaScriptが使える。
これらを駆使して、シンプルで使いやすい構造にする。
通常のOpenPNEでは、MVCの全体をPHP側（symfony）で行っていたが、VとCの要素をWEBクライアント側（JavaScript）に移動させる。symfonyはHTML、JavaScript、テンプレートをブラウザに送り出すことと、APIを通じてモデルを操作することに専念させる。

◆スマートフォンアクション全体図

１−１ブラウザからOpenPNEにリクエスト
http://openpne.jp/member/12 のように、パソコン版と同じURLにアクセスする。
アクセスされたPC版のアクセス内でスマートフォンの判定をし、スマートフォンからアクセスされた場合は、smtを頭につけた、アクションにフォワードする。PCでhomeActionならスマートフォンでsmtHomeAction となる。

１−２ブラウザにHTMLセットをレスポンス
フォワードされた、smtHomeAction内では、WEBクライアントで利用する初期HTML表示、データをコントロールするJavaScript、スマートフォンAPIから返ってきたJSONデータを整形するテンプレートの３つのセットをレンダリングし、
ブラウザに送り返す。

ここまでで、初期のHTMLを表示するリクエストとレスポンスが完了する。

２−１ jQueryでAPIアクセス
次にAJAXを使って、実際のデータを取得するAPIアクセスを行う。
ロードされたJavaScript（jQuery）によって、ブラウザのロードや、特定のボタンにひもづけられてデータ取得用の動作を行う。

スマートフォンAPIを通じてOpenPNEから取得する。この時HTML内に埋め込まれているapiKeyを使ってスマートフォンAPIを動作させる。apiKeyはSNSにログインしている限り、全ページに埋め込まれる。
※apiKeyの利用方法はMediaWikiの方式を参考にした。セキュリティ上の安全性確認はリリースまでに行う。

２−２ JSONデータをレンダリング
スマートフォンAPIからJSON形式でデータを受け取り、テンプレートに流しこんでHTMLをレンダリングする。

自分でつくるには？

OpenPNEコアに含まれるデータベース（モデル）の操作は、HOUOUで作っているAPIを使うことができる。
使い方のリファレンスはhttp://houou.github.com/api.php/ここで書き進めている。全体が完成ししだいOpenPNE公式サイトに設置する。

コアに含まれない独自プラグインのデータにアクセスするためには、/plugins/diary_list.json のような例を参考にしてOpenPNEを独自に拡張することになる。

OpenPNE3.8の正式版がリリースされた4月以降にhttps://github.com/openpne/OpenPNE3/ここから、ソースをフォークし、独自APIを付け足せばよい。

※とってもいいプラグインとAPIができたら、OpenPNEプロジェクトAPIをPullRequestしてください。

HOUOU開発系で新規に作っているといえば、ほとんどがスマートフォン関連部分。

そのほかは、機能をシンプルにしたり、減らしたりというのが中心だ。

テストを極力自動化し、開発段階から品質を高められる体制を作る。

※テストファーストのルール化は現時点では取り組まない

スマートフォンAPIのテスト

まずはスマートフォンAPIのテスト。
JSON形式で返答するWEBAPIが単純にズラーッと並んでいるだけなので、
こちらはsymfonyのユニットテストで十分カバーできる。

・初期データをつくる
・php内部からHTTPRequestを発行してAPIをキックする
・APIからのレスポンスを評価する
・データの変更をリセットする

このサイクルを、淡々と行っていけばいいだろう。
OpenPNEはユニットテストが充実していない（＝単体テストをうまく活用できる場面少ない）
機能テストやSeleniumはあるんだけれどね。

ので、ようやくテストの初歩を踏み出せるという感じだ。

スマートフォンクライアントのテスト

スマートフォンクライアントは、HTMLテンプレート＋jQueryというスタイルで作られている。
MVCのMだけサーバに置いておいて、クライアントにVとCを持ち込むという新スタイルを採用している。

ながれとしては、

・APIのコール
・レスポンスの加工
・テンプレートへのアサイン
これら一連のコントロールはすべてjQueryで行っている。

この動作をテストしたい。

JavaScriptに対応したテストを行う必要がある。
少し調べてみると、QUnitというのがあるそうだが、これを使えばいいのだろうか？

JavaScriptのテストは慣れていないが、自動化で品質向上をさせるよ。

そしてContinuous Integration

OpenPNEの品質を向上させるために継続的インテグレーションは悲願だ。
Travisというとんでもない素敵なサービスを見つけたので、ぜひ開発プロセスに組み込みたい。
http://travis-ci.org/

◆Travis

このサービスなんとHeadless動作でJavaScriptを動かすこともできるそうなので、
サーバのsymfonyもクライアントのJavascriptもまとめてTravisでテストを仕掛けたい。