1. リモートデバッグツール
weiner をつかってみた
2011.9.25 第2回HTML5など勉強会
HTML5-WEST.jp 村岡 正和

2. 自己紹介
むらおか まさかず
村岡正和 @bathtimefish
Webアプリケーション開発 IT業務システム設計/開発
Webサービス導入/事業戦略コンサルティング
HTML5-WEST.jp代表 / 京都GTUG / CSS Nite in OSAKA / 神戸ITフェス
ティバル実行委員など
HTML5-WEST.jp
HTML5 JavaScript
Python
中国拳法 主夫になりたい
炊事 Google Apps
http://html5-west.jp/

3. HTML5-WEST.jp
スマートフォンWebアプリ開発
楽なこと しんどいこと

4. 楽なこと
Okuyama
？
HTML5-WEST.jp

5. しんどいこと
Okuyama
1. デバッグ
2. デバッグ
3. デバッグ
HTML5-WEST.jp

6. HTML5-WEST.jp
デバッグといえば console.log()

7. iOS
Okuyama
HTML5-WEST.jp

8. Android
Okuyama
HTML5-WEST.jp

9. やってらんない

10. HTML5-WEST.jp
リモートデバッグツールを使う

11. リモートデバッグとは
Okuyama
スマートフォンでアクセス中のサイトを
PCのインスペクタでデバッグ可能。
ようやく文化的な生活ができるようになる。
HTML5-WEST.jp

12. リモートデバッグツールが
ないとき

14. あるとき

16. HTML5-WEST.jp
weiner

17. weiner
Okuyama
• http://phonegap.github.com/weinre/Home.html
• WebkitのWebインスペクタライクな
インターフェース
• WebSocket?, Cometで通信
• Chromeでも使えるらしい？
HTML5-WEST.jp

18. インストール・起動
Okuyama
• jarファイルをダウンロード
• $ java -jar weinre.jar
• http://localhost:8081/
HTML5-WEST.jp

19. スマートフォンブラウザとの接続
Okuyama
• bookmarklet で接続
• script要素で接続用スクリプトを埋め込む
HTML5-WEST.jp

20. Demo

21. Thanks!