Movatterモバイル変換


[0]ホーム

URL:


Yusuke Wada, profile picture
Uploaded byYusuke Wada
PDF, PPTX18,983 views

「新しい」を生み出すためのWebアプリ開発とその周辺

YAPC::Asia 2012

Embed presentation

Download as PDF, PPTX
「新しい」を生み出すためのWebアプリ開発とその周辺       YAPC::Asia 2012  Yusuke Wada a.k.a. yusukebe
0. イントロダクション
自己紹介• 和田裕介 1981/12/23 生• 慶応義塾大学政策メディア研究科修了• 株式会社ワディット代表取締役社長• 株式会社オモロキ取締役
0. イントロダクション     問いかけ
PerlでWebアプリを   作りたいって? Perlで「新しい」Webアプリをつくりたい  HowだけではなくWhatも大切だよね企画を含めてスモールスタート時の開発ノウハウ
対象サービス規模• スタートアップから小∼中規模• 月間1000万PV+αまで• 「量は質に転化する」• 大規模サービスと小規模だとつくり方 が大幅に違う小さな規模のアプリを効率よく開発し検証していこう
対象オーディエンス• 日曜大工的にWebアプリをつくりたい人• 少人数によるスタートアッププロジェクト• 「Perlを学んで何をしよう...?」• 企画/開発の人
アジェンダ1. 企画2. 事例その13. 開発4. サービスのスケール5. 事例その2               http://bokete.jp
1. さぁ何をつくろう
1. さぁ何をつくろう 企画にもプロセスがある
哲学        個々人が持つ変わらない思い                 料理は楽しい                                    cookpadの例アイデア        哲学をかなえる具体的なアイデア         レシピを共有、手順を紹介できる、つくれぽ ... テーマ        勝負する領域             料理についてのCGMサービスコンセプト        大枠。一言で言い表す          ユーザーがレシピを共有できるサービスデザイン        見た目に限らないディテール         料理写真をフューチャする、カテゴリ分け ...
企画のプロセス• いいサービスはプロセスが一気通貫 している• 必ずしも順番通りじゃなくてもよい• 人に紹介する時に有効
リスクを検証する
そこに潜むリスク• 技術リスク• スキルリスク    努力で解決する• リソースリスク     回避する             あきらめる• 政治リスク• 法的リスク
sandboxディレクトリで遊ぶ• /work/myapp/sandbox• 技術リスク、スキルリスクの検証• 単一スクリプトで結果が面白いか?• 例 : Web APIの利用
何をつくるか• スタートアップにおいて「何」が大事• 企画のプロセスが一気通貫するように• リスクを検証する
2. 事例その1
YourAVHost• 2007/12/27 リリース• 現在 1,000万PV/月• linode 2G x 1
哲学         エロ動画を試聴したい、良ければ買おうアイデア    エログの情報を元に騙しリンクなしの動画キュレーション テーマ           無料エロ動画紹介サービスコンセプト   AV女優名別などで探せて騙されず動画が見れるエロサイトデザイン     AV女優・ジャンルタグの表示、複数動画サイトへの対応
Google Blog検索、Twitter検索から           エログを抽出エログの中から動画共有サイトのURLを取得   動画共有サイトの情報を解析    カテゴライズしてDBに保存
自動キュレーション• システム運用だけで、コンテンツ運用 がいらない• 賢いバッチ処理の上、バックエンドで キャッシュを使う          企画が一気通貫しているので          サイトの方向性がぶれない         機能追加もほとんどしていない
1. さぁ何をつくろう    3. いよいよ開発
Webアプリを構成する要素• ルーティング• テンプレート            WAF+αで実装• モデルへの接続• セッション管理• バリデーション
WAFWebApplicationFramework
WAF選定• Catalyst• Mojolicious    依存が極力少ないもの                  インストールが速い• Dancer        フルスタックの必要はない                 (Catalyst+DBIC)• Amon2         開発している人が複数いる• 自作、その他
Mojolicious• Perlの標準モジュールだけに依存 • HTTPのreq/resオブジェクトまで自作• 使わない機能があるけれどポータブル
枯れつつある技術を使う• DBIx::Skinny/Teng as O/R Mapper• Mouse as Class Builder• MySQL as Database• Memcached as Cache Server
Modelの扱い• O/R Mapperを継承しただけをモデルと扱 わない• MyApp::API or MyApp::Model のようなビ ジネスロジックを含むAPIをつくる• コントローラが肥大化することを防ぐ• ロジックの重複を避ける
ディレクトリ構造./lib!"" MyApp#   !"" DB/#   !"" DB.pm#   !"" Model/#   !"" Model.pm#   !"" Role/#   !"" Web/#   %"" Web.pm%"" MyApp.pm
コントローラからの呼び出しモデルの呼び出し$self->model('Boke')->get_recent_entries();                        極力コントローラは書かなく                          てよいという方向性
Validation&FillInFormFormValidator、HTMLFillInForm の呼び出しif($self->form('Boke')->has_error) {    return $self->render_fill('/boke/post');}
スタートアップには• 既存WAF、O/R Mapperに任せてよい• 最低限のキャッシュ• No NoSQL!MySQLでおそらく十分• サーバも1台∼2台でスタートできる
4. スケーリング
サービスの利用者数が増えた      嬉しい悲鳴悲鳴を悲鳴のまま終わらせないようにシステムが処理できる能力を上げる
スケールアップとスケールアウトスペックを上げる              台数を増やす  サーバー     サーバー     サーバー スケールアップ      スケールアウト
サービスがスケールする時• VPSやクラウドサービスが安いのでス ケールアップ/アウトが容易• マネタイズの時期かも?• PR、お金周りなど苦手なことは他の人 に任せることができる
5. 事例その22. 事例その1
bokete.jp• 写真で一言ボケるサイト• 株式会社オモロキで開発• 鎌団子→企画、UI実装• ゆーすけべー→システム• 2008/9/16 ベータ版リリース
5.13事故が起こった
まとめサイト効果• ref スラッシュドット効果• 2chまとめ+NAVERまとめによる• 一時的なものではなく継続した
アラートヤバイ
スケールアップとスケール   アウトを狙う• linode 1GB x 2で運用していた• DBのデータがメモリに乗り切らない• ボトルネックはAppサーバとDBサーバ 両方にあり• ところが...
アプリが他環境で  動かない...   Catalyst+Pluginに大きく依存     動かないPlugin等が多数アプリのコードを大幅に書き換える必要が
デルタ版に向けた改修作業• フレームワークをMojoliciousに• O/R MapperをDBIx::Skinnyに• 極力依存を無くす• スケールアウトしやすい構成に        工数約一ヶ月の孤独な戦い
レプリケーション構成• 参照系はSlave、更新系はMaster• DBIx::Skinny→Master• 自作のDBIラッパー→Slave  Master   Slave   Slave   Slave
Bokete::DBx• DBIのラッパー• クエリは SQL::Abstract 形式• ArrayRef、HashRefで返却• search、search_by_sql、single• 適切なinflate• join的な動きを自動でやってくれる • boke -> odai -> photo
DBxのキャッシュ • クエリから自動的にキーをつくりキャッシュmy $key = "dbx:$table:"    . $self->make_key( [ '*', $where, $order ] );my $bokes = $self->dbx->search(    'boke',    [ $cond, ],    [ { -desc => 'rate_sum' } ],    {        limit => $limit,        offset => $offset,        expire => 60 * 10    });
キャッシュの注意• 更新頻度によっていつexpireさせるの かをサービスの特性から考える• ボケてにおいて滅多に変わらないもの • Photo • Odai• デッドロック?に注意
はまった点• サイドバーのキャッシュ• 生成するまで時間がかかる• expireした瞬間にデータ生成 が一気に始まる• プロセスを食いつぶしてアプリ が止まる
デッドロックへの対策  キャッシュ作成中のフラグを容易キャッシュが無くてもフラグが立っていれば 複製しておいたキャッシュを表示させる
7/19 リリース• さくらVPSサーバを複数台利用• JSを含めた表示速度が2倍以上高速に• 全体のPVも2倍近くUP• バグがいくつかあった
システムはボケてない
iPhone版 ボケて10月10日リリース予定• HALO、BraveSoftと 共同で開発• Web APIを用意
終わりに
マーケティング            デバイス展開チームビルディング                    マ                  プロモーションまつわることはまだある法律関係        コンテンツ運用  デプロイ                   ビジネスモデル         システム運用
Webサービスのつくり方   「ぐだぐだ言ってないでコードを書けよ、ハゲ」               Mac一つあれば…               エディタという道具11月末∼12月発売予定   無ければつくる               言語習得にまつわるエピソード               データの表現について分かった瞬間               僕がPerlを使うことから見る言語の選択               Blogの効用               勉強会に飛び込む               ライブラリという文化               実装までにつくる「企画」の全て               アイデアの発想法               そこに潜むリスク               ユースケースを書こう               データベース設計               クールなURI?               Webサービスを動かすための要素               30分、JavaScriptで作るWebサービスのモックアップ               月額980円のさくらVPSを個人用に使い倒す               Web APIで巨人の肩の上に立つ               いかにして大量のおっぱい画像をダウンロードするか               全裸で学ぶMVC事始め               MVCのMについて               WAFあれこれ               テストを書こう               イカ娘で学ぶTwitter OAuth認証               CSS Frameworkを持つ               Webサービス、最初の宣伝               「普通の」サーバ構成               運用してこそWebサービス               Webアプリのパフォーマンスアップ作戦               キャッシュ、キャッシュ、キャッシュ               サービスをスケールさせる時
やり方は一つじゃない

Recommended

PDF
「Webサービスのつくり方」 のつくり方
PPTX
スキトラ Spring + mybatis
PDF
いまさら聞けない!?Backbone.js 超入門
PDF
Rubyで始めるWebスクレイピング
PDF
jQueryを中心としたJavaScript
PDF
Mojolicious+redisでチャットを作った
PDF
なぜ人は必死でjQueryを捨てようとしているのか
PDF
とある Perl Monger の働き方
PDF
Mojoliciousでつくる! Webアプリ入門
PDF
JavaScript 研修
PDF
2015年GMOペパボ新卒エンジニア研修 Web開発研修イントロダクション
PDF
MyBatis を利用した web application 開発についてのご紹介
PDF
Webデザインの幅を広げる、jQuery【コードを記述する】 先生:保坂 庸介
PPTX
Rubyによるクローラー開発
PDF
JAWSUG architecture-crowler
PDF
まだ DOM 操作で消耗してるの?
PDF
webSocket通信を知らないiOSエンジニアが知っておいて損はしない(経験談的な)軽い話
PDF
RailsでReact.jsを動かしてみた話
PPTX
Spring bootで学ぶ初めてのwebアプリ開発
PDF
Capybaraで雑にWebスクレイピング
PDF
SIROK技術勉強会 #1 「Reactってなんだ?」
PDF
Node.jsでサーバプログラマ デビューしよう
PDF
React+fluxを導入した話
PDF
短期間+大規模ゲーム開発でも破綻しないHTML・SCSS
PDF
YARAIYA! Opendata with WordPress
PDF
Learning jQuery
PDF
gulp芸
PDF
BACKBONE.JSによるWebアプリケーション開発について
PDF
Node.jsでブラウザメッセンジャー
PDF
Node-v0.12のTLSを256倍使いこなす方法

More Related Content

PDF
「Webサービスのつくり方」 のつくり方
PPTX
スキトラ Spring + mybatis
PDF
いまさら聞けない!?Backbone.js 超入門
PDF
Rubyで始めるWebスクレイピング
PDF
jQueryを中心としたJavaScript
PDF
Mojolicious+redisでチャットを作った
PDF
なぜ人は必死でjQueryを捨てようとしているのか
PDF
とある Perl Monger の働き方
「Webサービスのつくり方」 のつくり方
スキトラ Spring + mybatis
いまさら聞けない!?Backbone.js 超入門
Rubyで始めるWebスクレイピング
jQueryを中心としたJavaScript
Mojolicious+redisでチャットを作った
なぜ人は必死でjQueryを捨てようとしているのか
とある Perl Monger の働き方

What's hot

PDF
Mojoliciousでつくる! Webアプリ入門
PDF
JavaScript 研修
PDF
2015年GMOペパボ新卒エンジニア研修 Web開発研修イントロダクション
PDF
MyBatis を利用した web application 開発についてのご紹介
PDF
Webデザインの幅を広げる、jQuery【コードを記述する】 先生:保坂 庸介
PPTX
Rubyによるクローラー開発
PDF
JAWSUG architecture-crowler
PDF
まだ DOM 操作で消耗してるの?
PDF
webSocket通信を知らないiOSエンジニアが知っておいて損はしない(経験談的な)軽い話
PDF
RailsでReact.jsを動かしてみた話
PPTX
Spring bootで学ぶ初めてのwebアプリ開発
PDF
Capybaraで雑にWebスクレイピング
PDF
SIROK技術勉強会 #1 「Reactってなんだ?」
PDF
Node.jsでサーバプログラマ デビューしよう
PDF
React+fluxを導入した話
PDF
短期間+大規模ゲーム開発でも破綻しないHTML・SCSS
PDF
YARAIYA! Opendata with WordPress
PDF
Learning jQuery
PDF
gulp芸
PDF
BACKBONE.JSによるWebアプリケーション開発について
Mojoliciousでつくる! Webアプリ入門
JavaScript 研修
2015年GMOペパボ新卒エンジニア研修 Web開発研修イントロダクション
MyBatis を利用した web application 開発についてのご紹介
Webデザインの幅を広げる、jQuery【コードを記述する】 先生:保坂 庸介
Rubyによるクローラー開発
JAWSUG architecture-crowler
まだ DOM 操作で消耗してるの?
webSocket通信を知らないiOSエンジニアが知っておいて損はしない(経験談的な)軽い話
RailsでReact.jsを動かしてみた話
Spring bootで学ぶ初めてのwebアプリ開発
Capybaraで雑にWebスクレイピング
SIROK技術勉強会 #1 「Reactってなんだ?」
Node.jsでサーバプログラマ デビューしよう
React+fluxを導入した話
短期間+大規模ゲーム開発でも破綻しないHTML・SCSS
YARAIYA! Opendata with WordPress
Learning jQuery
gulp芸
BACKBONE.JSによるWebアプリケーション開発について

Viewers also liked

PDF
Node.jsでブラウザメッセンジャー
PDF
Node-v0.12のTLSを256倍使いこなす方法
PPTX
Nodeで操るKurentoメディアサーバー ( Kurento + WebRTC + Node.js )
PDF
NodeFest2014 - Transpiler
PDF
power-assert, mechanism and philosophy
PDF
Real-time Bus Location System using by node.js
Node.jsでブラウザメッセンジャー
Node-v0.12のTLSを256倍使いこなす方法
Nodeで操るKurentoメディアサーバー ( Kurento + WebRTC + Node.js )
NodeFest2014 - Transpiler
power-assert, mechanism and philosophy
Real-time Bus Location System using by node.js

Similar to 「新しい」を生み出すためのWebアプリ開発とその周辺

PDF
地方企業がソーシャルゲーム開発を成功させるための10のポイント
PDF
ゆるべん Webアプリ開発概要 20130127
byY
 
PDF
Introduction to web development 1
PPTX
勉強会資料①
PDF
趣味プログラマの先輩からのアドバイス
PDF
2011年マイクロソフト テクノロジー振り返り~開発編~
PDF
Intalio japan special cloud workshop
PDF
Php conference 2010 final
PPTX
20170705 apiをつくろう
PDF
おすすめインフラ! for スタートアップ
PDF
Cakephp
PDF
eZ Publish 2012年4月勉強会 - eZ Publish設計ベストプラクティス
PDF
Amazon Web Servicesブース:UI×API×AWS 横田 聡
PDF
Synquery ja
PPT
Albatross
PPT
Cockatoo
PPTX
エンジニアという職業について
PPTX
非公式PaaS勉強会~新宿d社会議室
PDF
20121019 engineer startup_meeting
PPTX
JavaFX + NetBeans環境におけるJenkinsの活用(Jenkins第六回勉強会)
地方企業がソーシャルゲーム開発を成功させるための10のポイント
ゆるべん Webアプリ開発概要 20130127
byY
 
Introduction to web development 1
勉強会資料①
趣味プログラマの先輩からのアドバイス
2011年マイクロソフト テクノロジー振り返り~開発編~
Intalio japan special cloud workshop
Php conference 2010 final
20170705 apiをつくろう
おすすめインフラ! for スタートアップ
Cakephp
eZ Publish 2012年4月勉強会 - eZ Publish設計ベストプラクティス
Amazon Web Servicesブース:UI×API×AWS 横田 聡
Synquery ja
Albatross
Cockatoo
エンジニアという職業について
非公式PaaS勉強会~新宿d社会議室
20121019 engineer startup_meeting
JavaFX + NetBeans環境におけるJenkinsの活用(Jenkins第六回勉強会)

More from Yusuke Wada

PDF
Inside Bokete: Web Application with Mojolicious and others
PDF
Webサービスのコンテンツパターン 或いはデータの活⽤
PDF
Webサービス企画のコツ
PDF
スッとGoを取り入れる
PDF
僕らがWebサービスをつくる5つの理由
PDF
そのWebサービスは本当に「あたりまえ」だったのか?
PDF
Podcastを支える技術、エンジニアのためのWebメディア、そしてCPAN
PDF
The master plan of scaling a web application
PDF
僕らがつくるための 「5W」について
PDF
事故からはじまるスケールチャンス
PDF
僕らの履歴書
PDF
東京脱出計画中
PDF
創造のプロセスを回せ!v0.01
PDF
It's not only about "REMOTE"
PDF
Google BigQueryを使ってみた!
PDF
5 minutes - YAPC::Asia Tokyo 2014
PDF
Extreme remote working
PDF
Podcastをカジュアルに 支える技術
PDF
僕がつくった 70個のうちの48個のWebサービス達
PDF
10 things to learn from Bokete
Inside Bokete: Web Application with Mojolicious and others
Webサービスのコンテンツパターン 或いはデータの活⽤
Webサービス企画のコツ
スッとGoを取り入れる
僕らがWebサービスをつくる5つの理由
そのWebサービスは本当に「あたりまえ」だったのか?
Podcastを支える技術、エンジニアのためのWebメディア、そしてCPAN
The master plan of scaling a web application
僕らがつくるための 「5W」について
事故からはじまるスケールチャンス
僕らの履歴書
東京脱出計画中
創造のプロセスを回せ!v0.01
It's not only about "REMOTE"
Google BigQueryを使ってみた!
5 minutes - YAPC::Asia Tokyo 2014
Extreme remote working
Podcastをカジュアルに 支える技術
僕がつくった 70個のうちの48個のWebサービス達
10 things to learn from Bokete

「新しい」を生み出すためのWebアプリ開発とその周辺


[8]ページ先頭

©2009-2025 Movatter.jp