91
ぼくのかんがえたさいきょうの うぇぶあぷりけーしょん ふれーむわーく cho45 <[email protected]> 株式会社はてな

ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

Embed Size (px)

Citation preview

Page 1: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

ぼくのかんがえたさいきょうの

うぇぶあぷりけーしょん

ふれーむわーく

cho45 <[email protected]>株式会社はてな

Page 2: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

自己紹介

Page 3: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

id:cho45http://www.lowreal.net/

Page 4: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

株式会社はてな

京都8F勤務

Page 5: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

Perl (バックエンド)

JavaScript (フロントエンド)

Ruby (ツール作り)

Scala (たまにあそびで)

Java (Android アプリ)

Page 6: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

Config::PitConfig::ENVPlack::App::CocProxySQL::NamedPlaceholder

JSDeferred

Page 7: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

最近は

window.postMessageにハマっています

Page 8: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

Page 9: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

その話はしません

Page 10: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

趣味

Page 11: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

神社巡り

Page 12: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

写真

Page 13: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

プログラミングコード群: http://github.com/cho45

日記: http://subtech.g.hatena.ne.jp/cho45/

Page 14: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

本題

Page 15: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

の前に

Page 16: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

前提

Page 17: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

1.長期的にメンテナンスする

2.大規模

3.複数人開発

Page 18: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

個人で使うフレームワークとか正

直どうでもいいと思う。

Page 19: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

フレームワーク

つかってますか 

Page 20: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

Catalyst, Jifty, Dancer, CGI::Application, HTTP::

Engine, Mason, Squatting, Continuity, Maypole, Tatsumaki,

Mojolicious, Ark, Noe, Kamui, Amon2

ref. http://plackperl.org/

Page 21: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

ぼくのかんがえたさい

きょうのうぇぶあぷり

けーしょんふれーむ

わーく

Page 22: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

アジェンダ

●良いフレームワークとはなにか

●信頼性設計とかについて

●テストについて

Page 23: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

ぼくのかんがえたさい

きょうのうぇぶあぷり

けーしょんふれーむ

わーく

Page 24: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

を考える前に

Page 25: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

フレームワークの

Page 26: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

メリット デメリット

を整理します

Page 27: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

メリット

Page 28: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

共同開発しやすい

安全なフレームワークは安全

形になるまで早い

バッドノウハウの蓄積

うまくいかないとき

フレームワークのせいにできる

Page 29: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

共同開発しやすい

安全なフレームワークは安全

特に重要

Page 30: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

デメリット

Page 31: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

読むコードが増える

自由度がない

拡張性がない

フレームワークが糞だと

全てが糞になる

Page 32: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

フレームワークを覚えるのに

必死になりがち

挙動が意味不明

マジカルなことやりがち

Page 33: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

良いフレームワークとは?

Page 34: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

読むコードが最小

(共同開発のために)

 → 薄いフレームワーク

安全であること

 → 信頼性設計

Page 35: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

読むコードが最小

Page 36: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

だいたいフレームワークは

結局ハマって

全部コード読む

Page 37: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

だいたいフレームワークは

結局ハマって

全部コード読む

→ 学習コスト増大

Page 38: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

フレームワークのコードは

マジカルすぎて

意味不明

Page 39: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

フレームワークのコードは

マジカルすぎて

意味不明

→ 読むと Perl に詳しく

Page 40: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

フレームワークのコードは

マジカルすぎて

意味不明

→ 学習コスト アゲ♂アゲ

Page 41: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

ある prepan.org 作者のつぶやき

「○○っていうフレームワークつかってるん

だけど、もう嫌なんだよね。

 フルスタックなんだけどドキュメントよくわ

からないし。

 中身読もうとすると意味不明だし」

Page 42: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

薄いフレームワークが良い

↑良くいう

Page 43: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

薄いフレームワーク

Page 44: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

を極める

Page 45: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

何も実装がない

フレームワーク

Page 46: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

どういうこと?

Page 47: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

限りなく薄いフレームワークとは

↓設計指針

● 安全

● 読むコード最小

Page 48: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

フレームワークは

実装ではなく設計指針

共同開発に必要なのは

共通の実装ではなく

共通の設計指針

Page 49: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

僕の考える設計指針=フレームワーク

安全 (信頼性設計)

読むコード最小 (メンテコスト)

Page 50: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

信頼性設計

Page 51: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

危険なことをするために

より多くのコストが

必要になるように

Page 52: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

例: 最低限必要なXSS対策

デフォルトで HTML エスケープ

[% req.param('query') %]

危ないことをしようとするときは手間をかける

[% req.param('query') | raw %]

Page 53: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

読むコード最小

Page 54: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

DRY3

3回コピペしたら抽象化しろ

(不必要な/下手クソな抽象化は悪)

Page 55: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

設計例: Hatena Blog

Page 56: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

長期的に開発することを念頭に

柔軟性

新機能を加えるときに読むべき

コードを最小化

信頼性設計

Page 57: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

柔軟性と

読むべきコードの最小化を

同時に達成しようとすると

ドメイン特化にならざるを得ない

Page 58: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

安全で最小限な実装を

プロジェクト内に持つ

設計指針を明確にする

Page 59: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

僕の考える設計指針=フレームワーク

安全 (信頼性設計)

読むコード最小 (メンテコスト)

再掲

Page 60: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

設計指針

安全 (信頼性設計)

読むコード最小 (メンテコスト)

早い (ユーザ体験)

Page 61: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

ディスパッチャ

Plack + Router::Simple + α

ビュー

Text::Xslate, JSON:XS, etc...

DBアクセス

DBI生 + SQL::NamedPlaceholder(DBアクセスはコストがかかるので面倒にしとく)

Page 62: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

既存実装(Ridge)を使わなかった理由

 → 安全じゃなかったら

 → テストも十分ではなかった

安全にする

テストを十分に

+ app.psgi から

あっちこっちいかずに読み下せるように

Page 63: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

安全策

Page 64: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

HTML出力時

自動エスケープ

→ XSS対策

Page 65: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

POST時にトークン自動チェック

→ CSRF対策

Page 66: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

JSON出力時

XMLHtmlRequestのX-Requested-Withを自動チェック

→ IE XSS 対策 / UTF-7攻撃対策 / JSON読み出し対策

Page 67: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

自動で

X-Frame-Options: DENY→ クリックジャッキング対策

Page 68: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

iframeでロードされたフォームでは

何か変更されないと submit 不可

→ クリックジャッキング対策(どうしても iframe 使う場合のフォールバック)

Page 69: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

自動でできるだけ安全に

Page 70: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

適切なデフォルトを設定

Page 71: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

テスト

Page 72: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

テストが大量にあってもメンテしない

レイヤー(Appとか)を増やすとテストが増える

読むコードが増える

最小限の構成Model + Controller

Page 73: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

Model のテスト

(仕様があまり変わらない)

ロジックのみ (DBアクセスなし)

細かい挙動をチェック

カバレッジ重視 (ホワイトボックステスト)

Page 74: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

例:

use Test::More;

# ロジックしかないので難しいところなしmy $e = Entry->new({body => '..'});is_deeply $e->classes, [ ... ];done_testing;

Page 75: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

Controller のテスト

(しばしば細かい仕様が変わる)

ディスパッチ → 出力までTest::WWW::Mechanize::PSGI

ユーザの挙動をシミュレート

(ブラックボックステスト)

Page 76: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

例:

use My::Test qw(create_hatena_user mechanize);

# DB アクセスとかはいい感じにしてるmy $user = create_hatena_user();my $mech = mechanize($user);my $blog_id = $mech->create_blog_ok;ok $blog_id;my $entry_id = $mech->post_entry_ok(blog_id => $blog_id);ok $entry_id; done_testing;

Page 77: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

早い

Page 78: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

use DBI;

Page 79: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

ORM は

勝手にDBひくな

Page 80: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

ORM は

勝手にblessするな

Page 81: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

コストがかかることを

便利にしてはいけない

Page 82: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

実装

Page 83: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

大枠としてはだいたいこんなかんじですhttps://github.com/cho45/starter.pl/tree/master/templates/mywebapp

(スケルトンジェネレータのテンプレートレベルのコード)

Page 84: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

まとめ

Page 85: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

ぼくのかんがえたさい

きょうのうぇぶあぷり

けーしょんふれーむ

わーく

Page 86: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

とはなんだったのか

Page 87: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

設計指針

Page 88: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

サービス特化の

実装

Page 89: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

僕の考えた最強の設計指針

Page 90: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

僕の考えた最低限の設計指針

● 安全 (信頼性設計)

● 読むコード最小 (メンテコスト)

● 早い (ユーザ体験)

実装は必要に応じて選び

必要であれば最低限自分で書くのが良い

Page 91: ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく - YAPC Asia 2011

ご清聴ありがとうございました

www.lowreal.net