関西Firefox OS勉強会 4th GIG

1. WEB屋さんが
アプリを作ってみたら
@junkpot1212

2. 自己紹介
名前: 上田 信尋
Twitter: junkpot1212
Blog: http://tech.junkpot.net
WEB屋さん
PHPer
お仕事ください

3. 前回のLTのおさらい

4. Firefox OSの不便なところ
・iOSやAndroidのように
電話帳やカレンダーのクラウド同期が無い

5. 無いなら
作っちゃえばいいんですよ(ﾟ∀ﾟ)

6. 丸投げ
作ってないんかいのツッコミ多数

7. ってことで同期できるアプリを
作ってみよう

8. 電話帳の
クラウド同期アプリ

9. 既にあった

10. OSが対応してた

12. カレンダーの
クラウド同期アプリ

13. OSが対応してた

14. 大ピンチ
※事実に気付いたのが昨日の夜

15. 作るネタがなくなって大ピンチ

16. 途方にくれつつ何か無いかと
手持ちのAndroidの
ホーム画面を眺めてみる

17. foursquare

18. WEB屋さんが
foursquareアプリを
作ってみたら

19. foursqareって？
foursquare（フォースクエア）は、
位置情報に基づいた
ソーシャル・ネットワーキング・サービスのウェブサイト、
携帯電話用ソフトウェア、
およびゲーム（位置ゲー）である。
※Wikipediaより
スポットにチェックインして場所を共有したり
チェックイン状況によってバッジが獲得出来たり

20. ●
●
●
色んなプラットフォーム対応
ブラウザでアクセスすると←の
ような表示に
OAuth API対応

21. FirefoxOS版を作ってみた

22. デモやります

23. 開発に使ったツール
•
•
Netbeans
Firefox OS simulator

24. foursquare api Document
https://developer.foursquare.com/start
公式ドキュメント
結構丁寧に書いてある
http://tdoc.info/foursquare-API/index.html
有志による非公式日本語訳も

25. 注意点
・OAuth認証
foursquareへのアプリ登録の際に設定するredirect Urlと
トークンをリクエストする時のredirect_urlは
共通にしないと動かない
・権限の設定
特権(privileged)アプリにする
systemXHR, geolocation, browser
3つのpermissionsを設定する
・シミュレーターは位置情報を
常にMozilla本社付近を返す

26. OAuth認証

27. OAuth認証
Redirect Url を揃えないと動かないので
アプリ内ブラウザを使ってダミーのredirect Urlでリクエストし、
アプリ内ブラウザが遷移したURLからトークンを取得。

28. manifest.webapp

29. manifest.webapp
"type": "privileged" で特権アプリの設定
"systemXHR": OAuth等の通信に必要
"browser": アプリ内ブラウザ

30. あとは普通に普通に
API通信を頑張れば完成

31. 感想
・WEB向けAPIをアプリで使うのに多少工夫が必要
・むしろアプリ内ブラウザ等ただブラウザでやるより便利な面も？
・昨日の夜は泣きそうだった

32. 教訓

33. Firefox OS の進化の速さを
侮るなかれ

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