Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
Firefox OS: Blaze Your Own Path       Slides @ ABC 2013 Spring       by Tomoya Asai (dynamis)                             ...
FFiirreeffooxx  OOSS  でAAnnddrrooiidd  端末の世界が広がる!?
about:me
about:dynamis           Lesser Panda @ Mozilla               http://dynamis.jp                @dynamitter            faceb...
Topics
本日のトピックぼくおやつ   Background担当ねっ!        Overview        Build & Flash        App Dev        Marketplace
about:foxkeh       今日もプレゼンを手伝って     くれるフォクすけを紹介します
ぼくフォクすけ   いつか僕も Firefox みたいな   立派なブラウザになるんだ!
サーバ (Apache Camel) の上にクライアント (Firefox)
君と一緒にお出     かけしたいな!ぼくのステッカーを君のPC とスマホに貼ってね!
Background
独自プラットフォーム    ネイティブアプリ     機能も速度もネイティブ優先    アプリエコシステム     制限多くビジネスの自由度低い    WebView + 独自 API     Web はサブセット扱い
独自プラットフォーム i       a        f       cプラットフォーム毎に異なる言語で個別の専用アプリを作る必要がある
独自プラットフォームの課題    プラットフォーム依存     それぞれ異なる言語や API    不透明な継続性・再利用性     ベンダー依存の運命共同体    Fragmentation・実装依存     同一プラットフォームでも非互換
独自プラットフォームの課題    プラットフォーム依存     それぞれ異なる言語や API    不透明な継続性・再利用性     ベンダー依存の運命共同体    Fragmentation・実装依存     同一プラットフォームでも非互換
Fragmentation...http://i0.wp.com/cerebrux.files.wordpress.com/2012/09/                                     androidclones.jpg
"HTML5" への期待      次世代プラットフォーム       Web 技術で何でも可能に      Web アプリ開発を簡単に       API の充実と互換性確保      マルチデバイス対応       開発言語や API の共通化
Web が共通プラットフォーム                プラットフォーム                  としての WebWeb がプラットフォームなら業界標準技術でアプリ環境が統一される
標準技術 のオープンな世界      vs独自技術 による囲い込み    「ブラウザ戦争」の時代はとっくに終わりました
HTML5 = WebKit の方が良い?       それどの WebKit?        IE6 vs IE10 以上に違う現実       その API と実装で大丈夫?        複数実装でより良い標準に       イノベーショ...
HTML5 = WebKit の方が良い?       それどの WebKit?        IE6 vs IE10 以上に違う現実       その API と実装で大丈夫?        複数実装でより良い標準に       イノベーショ...
I am sad that the Web didn t handle small screens ̶     and later, touch UI ̶ that well. ... snip ...For touch, though, I ...
独占やクローズド仕様は残念…    タッチイベントが残念…     ドラッグ&ドロップは?     ピンチとホイールの対応は?    密室で作られたから…     最初の人気タッチブラウザ実装     Web 技術知らない奴らが作った     ...
オープンな環境と競争でイノベーションを加速!     オープンと競争は革新の源泉
Overview
FFiirreeffooxx  OOSS  って   どんな感じ?               フォクすけもわくわく。
Firefox OS = Boot to Gecko          Gecko エンジンだけ起動           Kernel 上に Gecko (Web Engine)           Java VM など不要な部分は削除    ...
WHAT IS FIREFOX OS?HOW IS IT DIFFERENT FROM ANDROID             シンプル&スマート                           Firefox OS       Andro...
WHAT IS FIREFOX OS:ARCHITECTURE OVERVIEW          アーキテクチャ     Gaia                          Web Content (App)             ...
Web 技術 = Native         Web 技術が「ネイティブ」          HTML/CSS/JS ですべて可能に          新しい API は W3C 標準化         速度も Java に追いつく     ...
ステータスバー (通知、電波強度、電池残量...)もカメラやラジオもビデオや音楽の再生もマーケットプレイスもシステムの環境設定もホーム画面や壁紙も電話や SMS の送受信ももちろん ブラウザ も  その他なんでも...
ステータスバー (通知、      電波強度、電池残量...)も      カメラやラジオも      ビデオや音楽の再生も      マーケットプレイスも      システムの環境設定も      ホーム画面や壁紙も      電話や SMS...
2012 年実装 Web APIAlarm                  File Handle         Push Notificationsattention screen       FM Radio            Set...
Next Web APIBackground Services              PaymentBluetooth-***                    QuotaCalendar                        ...
Firefox OS の魅力           スリムな HTML5 実行環境            $100 でもフル機能のスマホを            今後の高速化もし易い設計           圧倒的な開発者数           ...
開発者の多いプラットフォーム                    800万人10万人      45万人       調査にも依るけど HTML5 開発者の方が圧倒的に多い
Firefox OS とセキュリティ       ユーザがアプリ権限管理可        インストール時と実行時に権限を        許可するハイブリッド方式        「インストール時に全て許可」で        はプライバシーは守れな...
*1アプリも「ぐぐる」時代へ          "まずインストール" は古い           ディレクトリ(分類)だけのマーケ           ットでは Google のない Web           Web と Market の横断...
透明性や自由度の              高いプラットフォーム       既存の独占的                          Firefox OS による      プラットフォーム                       ...
MWC ANNOUNCEMENTS  Ecosystem Commitments パートナーとの製品化         日本では KDDI が参加表明
Global アプリパートナーまだまだあるけど入り切りません。一部ロゴ古いかも。ゴメンね。
ステキ。   僕もスマホになって君と  一緒にお出かけしたいな!
Build & Flash
サポート端末 (最新じゃない?)                               Tier 1                                 Unagi, Otoro, Pandaboard, Emulator, ...
おさかなさん=???    Goldfish = 金魚    Trout = サケ科の総称    Mahimahi = マヒマヒ    Herring = ニシン    Stingray = アカエイ    Tuna (Maguro & Toro)
おさかなさん=端末 (Android)       Goldfish = Emulator       Trout = G1       Mahimahi = Nexus One       Herring = Nexus S       Sti...
おすし=端末 (Firefox OS)       Otoro = 初代開発機       Unagi = 第二代開発機       Ikura = 第三代?       Inari = ???       Hamachi = ???     ...
ビルド環境          Mac OS X           XCode 4.3.1          64bit GNU/Linux           GCC 4.6.3           Ubuntu 12.04 が標準     ...
Firefox OS ビルド環境 (Mac)//	 1.	 XCode,	 Command	 Line	 Tools	 インストール//	 2.	 XCode	 4.3.x	 から	 MacOSX10.6.sdk	 をコピー//	 	 	 	 ...
Firefox OS のビルド&書き込み//	 1.	 リポジトリの	 Clonegit	 clone	 git://github.com/mozilla-b2g/B2G.gitcd	 B2G//	 2.	 対象端末を指定	 (引数無しでリスト...
Apps Dev
Firefox OS のアプリ開発       Web アプリです。       Web アプリです。       Web アプリです。       大事なこと3回
Firefox OS のアプリ開発       Web アプリです。       Web アプリです。       Web アプリです。       大事なこと3回
Firefox OS のアプリ開発       いつもの開発ツール       いつものエディタ       いつものライブラリ       いつもと一緒だ       から安心だね!
アプリ開発の流れ    普通に Web 開発     デバッグもいつも通り    manifest ファイルを用意     メタ情報を JSON 形式で記載    シミュレータや実機テスト     PC で動かない API は実機で確認    ...
manifest.webapp 追加するだけ       Hosted App        Web から読み込むアプリ        Web サイト + manifest.webapp       Packaged App        従来...
manifest.webapp ファイル{  "name":	 "フォクすけアプリ",  "description":	 "あのフォクすけが遂にアプリに!",  "launch_path":	 "/index.html",  "icons":	...
Firefox OS Simulator               再起動不要の拡張機能                 https://addons.mozilla.org/ja/                 firefox/addon/...
Firefox OS Simulator (r2d2b2g)          プロファイル付きデスクトップビルドにホームボタンを追加       コンソールやディレクトリからアプリケーションを読み込む機能も
シミュレータにインストール    Add Directory ボタン     manifest ファイルを選択     zip されて packaged app として     インストールされ、起動する    Update ボタンで更新   ...
つーるきっととかは?        Firefox OS 標準の     ライブラリとかあるの?
GAIA Building Blocks (UI 部品)          Gaia (Firefox OS 標準) Apps          のデザインを簡単に作れる           http://buildingfirefoxos.co...
Marketplace
まーけっと?   Web アプリの配信方法は?
Firefox Marketplace          Device, OS 横断マーケット           Web Platform のためのストア           Firefox 限定にならない設計          現在テスター...
オープンなアプリストア    全てを Web 技術で実装     安定・平等な環境を提供     Marketplace のソースも公開    ベンダー非依存     Firefox Marketplace 以外にも     ストア、認証、課金...
オープンなレビューシステム                     コミュニティレビュー                        Firefox のアドオンと同じ                        レビュー基準もレビュアーもす...
自分のサイトで配布               install() 関数使うだけ                 navigator.mozApps.install(url)                 manifest ファイル URL ...
navigator.mozApps.install(url)var	 Apps	 =	 navigator.mozApps;var	 manifesturl	 	 	 	 =	 "http://apps.dynamis.jp/manifest....
Firefox = WebRT (WebRunTime) どろいど君    Gecko は元からアプリ環境とも仲良し!           Firefox = Gecko で XUL/JS           WebApps = Gecko で...
Android に Web アプリ環境を        Web App = Native App に          ホームスクリーンへの追加や          独立してフル画面起動など          ネイティブ同様の利用体験     ...
PC にも Web アプリ環境を      Web App = Native App に       プログラムフォルダ (アプリケー       ションディレクトリ) への追加       ウィンドウはもちろんプロセスも       データも...
WWeebb  だからどこにでも!      Web らしいシステムだね!
実機で開発したい?     僕の手でも使えるかな?
Developer Preview Phone   Telefónica と Geeksphone が作る開発者向けテスト端末
Developer Preview Phone      近日発売予定      Keon:       Snapdragon 1GHz, 4GB ROM,       512MB RAM, 3.5" HVGA      Peak:      ...
もっと知りたい?     僕はもっと知りたい!
Firefox OS コミュニティを!       http://FxOS.org/        (https://groups.google.com/group/        firefoxos にリダイレクト)       http://...
質問ある?ぼくには難しいことは分からないけど許してね。
See Also...
開発者ツール紹介    一通りの機能と使い方    Firefox 標準の開発者ツール     隠し設定やビルトイン関数のリ     ファレンスなども含めています    Firebug とその拡張機能     アイコンや背景画像を変更する   ...
Web 技術 2012 年の変化      最新 Web 技術動向       2012 年に進化した点やブラウザ       ベンダーの動向を紹介      HTML5 から HTML5.1 へ       HTML の仕様は進化と安定化が ...
JavaScript.Next          JavaScript の最新仕様           ECMAScript 5th のポイント          JavaScript 次世代仕様           ECMAScript 6t...
セキュリティ関連機能紹介    セキュリティ大事!     知っておくべき機能です    Content Security Policy     次世代セキュリティポリシー     Same Origin Policy はもう古い       ...
Firefox OS - Blaze Your Own Path
Firefox OS - Blaze Your Own Path
Firefox OS - Blaze Your Own Path
Firefox OS - Blaze Your Own Path
Firefox OS - Blaze Your Own Path
Firefox OS - Blaze Your Own Path
Firefox OS - Blaze Your Own Path
Upcoming SlideShare
Loading in …5
×

Firefox OS - Blaze Your Own Path

7,981 views

Published on

Published in: Technology
  • Be the first to comment

Firefox OS - Blaze Your Own Path

  1. 1. Firefox OS: Blaze Your Own Path Slides @ ABC 2013 Spring by Tomoya Asai (dynamis) Last Update: 2013/03/16
  2. 2. FFiirreeffooxx OOSS でAAnnddrrooiidd 端末の世界が広がる!?
  3. 3. about:me
  4. 4. about:dynamis Lesser Panda @ Mozilla http://dynamis.jp @dynamitter facebook.com/ dynamis レッサーパンダが好き。 mailto: Tomoya ASAI <dynamis@mozilla-japan.org>
  5. 5. Topics
  6. 6. 本日のトピックぼくおやつ Background担当ねっ! Overview Build & Flash App Dev Marketplace
  7. 7. about:foxkeh 今日もプレゼンを手伝って くれるフォクすけを紹介します
  8. 8. ぼくフォクすけ いつか僕も Firefox みたいな 立派なブラウザになるんだ!
  9. 9. サーバ (Apache Camel) の上にクライアント (Firefox)
  10. 10. 君と一緒にお出 かけしたいな!ぼくのステッカーを君のPC とスマホに貼ってね!
  11. 11. Background
  12. 12. 独自プラットフォーム ネイティブアプリ 機能も速度もネイティブ優先 アプリエコシステム 制限多くビジネスの自由度低い WebView + 独自 API Web はサブセット扱い
  13. 13. 独自プラットフォーム i a f cプラットフォーム毎に異なる言語で個別の専用アプリを作る必要がある
  14. 14. 独自プラットフォームの課題 プラットフォーム依存 それぞれ異なる言語や API 不透明な継続性・再利用性 ベンダー依存の運命共同体 Fragmentation・実装依存 同一プラットフォームでも非互換
  15. 15. 独自プラットフォームの課題 プラットフォーム依存 それぞれ異なる言語や API 不透明な継続性・再利用性 ベンダー依存の運命共同体 Fragmentation・実装依存 同一プラットフォームでも非互換
  16. 16. Fragmentation...http://i0.wp.com/cerebrux.files.wordpress.com/2012/09/ androidclones.jpg
  17. 17. "HTML5" への期待 次世代プラットフォーム Web 技術で何でも可能に Web アプリ開発を簡単に API の充実と互換性確保 マルチデバイス対応 開発言語や API の共通化
  18. 18. Web が共通プラットフォーム プラットフォーム としての WebWeb がプラットフォームなら業界標準技術でアプリ環境が統一される
  19. 19. 標準技術 のオープンな世界 vs独自技術 による囲い込み 「ブラウザ戦争」の時代はとっくに終わりました
  20. 20. HTML5 = WebKit の方が良い? それどの WebKit? IE6 vs IE10 以上に違う現実 その API と実装で大丈夫? 複数実装でより良い標準に イノベーションは競争から 独占が進化を止めてたよね…
  21. 21. HTML5 = WebKit の方が良い? それどの WebKit? IE6 vs IE10 以上に違う現実 その API と実装で大丈夫? 複数実装でより良い標準に イノベーションは競争から 独占が進化を止めてたよね…
  22. 22. I am sad that the Web didn t handle small screens ̶ and later, touch UI ̶ that well. ... snip ...For touch, though, I wish we had done a better job ofmapping the UI to the Web s generic events. A touch gets mapped to a click event easily enough, butdrag-and-drop never got mapped, pinch gestures didn t get mapped to wheel events, etc. Mainly I think this is because the first truly successful touch browser set the standard, and it was developedmostly in secret with a small team many of whom, as I understand it, weren t Web veterans. Ian Hickson のインタビューより
  23. 23. 独占やクローズド仕様は残念… タッチイベントが残念… ドラッグ&ドロップは? ピンチとホイールの対応は? 密室で作られたから… 最初の人気タッチブラウザ実装 Web 技術知らない奴らが作った オープンな標準は世界の英知の結晶
  24. 24. オープンな環境と競争でイノベーションを加速! オープンと競争は革新の源泉
  25. 25. Overview
  26. 26. FFiirreeffooxx OOSS って どんな感じ? フォクすけもわくわく。
  27. 27. Firefox OS = Boot to Gecko Gecko エンジンだけ起動 Kernel 上に Gecko (Web Engine) Java VM など不要な部分は削除 HAL 層は Android と共通 Linux 部分で独自性は必要ない Android と同じエコシステム プロジェクト名は今でも Boot to Gecko
  28. 28. WHAT IS FIREFOX OS?HOW IS IT DIFFERENT FROM ANDROID シンプル&スマート Firefox OS Android Web Browser/ Platform HTML5 User Native API- Experience/ based UI Content Web Engine/ APIs Standard Device APIs Kernel (e.g. Android, iOS, Kernel Win7, etc.) Device (phone, tablet, Device desktop) Web プラットフォームの実行環境としては圧倒的にスマート!
  29. 29. WHAT IS FIREFOX OS:ARCHITECTURE OVERVIEW アーキテクチャ Gaia Web Content (App) Gecko child Gecko Execution Parent Environment Access Control Permission Manager List Gecko Web API Credential Permissions I/O (hardware & data stores) Validation Store Boot to Gecko (b2g) Gonk Low-level processes, proxies & daemons (rild, mediaserver, netd, etc.) Device Device hardware
  30. 30. Web 技術 = Native Web 技術が「ネイティブ」 HTML/CSS/JS ですべて可能に 新しい API は W3C 標準化 速度も Java に追いつく 単純な演算程度なら既に同程度 WebGL や DOMCrypt なども活用 時間の問題だから期待しててね! Web 技術だけですべてが済むプラットフォームとなるよう発展中
  31. 31. ステータスバー (通知、電波強度、電池残量...)もカメラやラジオもビデオや音楽の再生もマーケットプレイスもシステムの環境設定もホーム画面や壁紙も電話や SMS の送受信ももちろん ブラウザ も その他なんでも...
  32. 32. ステータスバー (通知、 電波強度、電池残量...)も カメラやラジオも ビデオや音楽の再生も マーケットプレイスも システムの環境設定も ホーム画面や壁紙も 電話や SMS の送受信も もちろん ブラウザ も その他なんでも...すべて Web 技術で!
  33. 33. 2012 年実装 Web APIAlarm File Handle Push Notificationsattention screen FM Radio SettingsArchive IdleAPI SMSAudio Policy Mouse Lock Screen OrientationBackground Sensor Mobile Connection System XHRBrowser Network Events TCP SocketCamera Network Stats Web TelephonyContacts Manage Time ManagerDesktop Notification Payment Open Web AppsDevice Storage Permissions WiFi ManagementEmbed Apps Power Management などなど... 実装状況などのまとめ表: https://wiki.mozilla.org/WebAPI
  34. 34. Next Web APIBackground Services PaymentBluetooth-*** QuotaCalendar Resource LockDatabase Migration (temp to Simple Storagepermanent storage) Social APIFileSystem? SPDY Server PushNFC SpellcheckHTTP-cache UDB Datagram SocketKeyboard/IME USB (low-level)Log USB file-readingMPEG DASH WebRTC - CameraOpen Web Apps WebRTC - P2PParallel Array などなど... どこまで今年中にサポートされるか楽しみ!
  35. 35. Firefox OS の魅力 スリムな HTML5 実行環境 $100 でもフル機能のスマホを 今後の高速化もし易い設計 圧倒的な開発者数 Web 技術だけですぐアプリ開発 ハイブリッド権限管理 インストール時 or 実行時の許可 急速な高速化が続き、型推論の効く処理は既に Dalvik/Java にも匹敵
  36. 36. 開発者の多いプラットフォーム 800万人10万人 45万人 調査にも依るけど HTML5 開発者の方が圧倒的に多い
  37. 37. Firefox OS とセキュリティ ユーザがアプリ権限管理可 インストール時と実行時に権限を 許可するハイブリッド方式 「インストール時に全て許可」で はプライバシーは守れなかった ユーザが理解できプライバシーな どに関わる API は実行時確認
  38. 38. *1アプリも「ぐぐる」時代へ "まずインストール" は古い ディレクトリ(分類)だけのマーケ ットでは Google のない Web Web と Market の横断検索 動的な Web アプリ環境 Web はアクセスするだけ アプリを検索してまず試し、 気に入ったらホームに追加する *1 everything.me ってサービスだから正確には「えぶる」かも?
  39. 39. 透明性や自由度の 高いプラットフォーム 既存の独占的 Firefox OS による プラットフォーム Open プラットフォーム 開発者/OEM/キャリア market 開発者/OEM/ / キャリア Apple Google MS App Store Play MarketplaceiPhone/iPad 端末 端末 ユーザ ユーザ ユーザ ユーザ 端末
  40. 40. MWC ANNOUNCEMENTS Ecosystem Commitments パートナーとの製品化 日本では KDDI が参加表明
  41. 41. Global アプリパートナーまだまだあるけど入り切りません。一部ロゴ古いかも。ゴメンね。
  42. 42. ステキ。 僕もスマホになって君と 一緒にお出かけしたいな!
  43. 43. Build & Flash
  44. 44. サポート端末 (最新じゃない?) Tier 1 Unagi, Otoro, Pandaboard, Emulator, PC Tier 2 Nexus S, Nexus S 4G Tier 3 Galaxy S2, Glaxy Nexus ICS (Android 4.0)∼ の動作端末 上記以外の端末にはパッチが必要https://developer.mozilla.org/ja/docs/Mozilla/Firefox_OS/Firefox_OS_build_prerequisites
  45. 45. おさかなさん=??? Goldfish = 金魚 Trout = サケ科の総称 Mahimahi = マヒマヒ Herring = ニシン Stingray = アカエイ Tuna (Maguro & Toro)
  46. 46. おさかなさん=端末 (Android) Goldfish = Emulator Trout = G1 Mahimahi = Nexus One Herring = Nexus S Stingray = Xoom Tuna = Galaxy Nexus Android では伝統的に端末のコードネームがおさかなさん
  47. 47. おすし=端末 (Firefox OS) Otoro = 初代開発機 Unagi = 第二代開発機 Ikura = 第三代? Inari = ??? Hamachi = ??? Buri = ??? Firefox OS では端末のコードネームは寿司ネタ
  48. 48. ビルド環境 Mac OS X XCode 4.3.1 64bit GNU/Linux GCC 4.6.3 Ubuntu 12.04 が標準 Linux Mint 13, Debian 6, Ubuntu 12.10, Fedora 16/17/18標準ビルドは Ubuntu で作られてますが Mac でビルドするのが楽です
  49. 49. Firefox OS ビルド環境 (Mac)// 1. XCode, Command Line Tools インストール// 2. XCode 4.3.x から MacOSX10.6.sdk をコピー// /Applications/Xcode.app/Contents/Developer/Platforms/MacOSX.platform/Developer/SDKs/MacOSX10.6.sdk// 3. HomeBrew が入ってなければ入れるruby -e "$(curl -fsSkL raw.github.com/mxcl/homebrew/go)"// 4. セットアップスクリプト実行!curl -fsSL https://raw.github.com/mozilla-b2g/B2G/master/scripts/bootstrap-mac.sh | bash https://github.com/dynamis/firefoxos/wiki/article#wiki-build
  50. 50. Firefox OS のビルド&書き込み// 1. リポジトリの Clonegit clone git://github.com/mozilla-b2g/B2G.gitcd B2G// 2. 対象端末を指定 (引数無しでリスト表示)./config.sh nexus-s// 2. ビルド実行 (-j* は並列ビルド数の指定)./build.sh -j4// 3. 端末に書き込み (adb 必要です)./flash.sh https://developer.mozilla.org/en-US/docs/Mozilla/Firefox_OS/Building
  51. 51. Apps Dev
  52. 52. Firefox OS のアプリ開発 Web アプリです。 Web アプリです。 Web アプリです。 大事なこと3回
  53. 53. Firefox OS のアプリ開発 Web アプリです。 Web アプリです。 Web アプリです。 大事なこと3回
  54. 54. Firefox OS のアプリ開発 いつもの開発ツール いつものエディタ いつものライブラリ いつもと一緒だ から安心だね!
  55. 55. アプリ開発の流れ 普通に Web 開発 デバッグもいつも通り manifest ファイルを用意 メタ情報を JSON 形式で記載 シミュレータや実機テスト PC で動かない API は実機で確認 Vibration や Sensor など... https://github.com/dynamis/firefoxos/wiki/simulator
  56. 56. manifest.webapp 追加するだけ Hosted App Web から読み込むアプリ Web サイト + manifest.webapp Packaged App 従来型のダウンロードアプリ サイト全体を ZIP するだけ
  57. 57. manifest.webapp ファイル{  "name": "フォクすけアプリ",  "description": "あのフォクすけが遂にアプリに!",  "launch_path": "/index.html",  "icons": {    "128": "/icons/foxkeh-128.png"  },  "developer": {    "name": "dynamis",    "url": "http://dynamis.jp/"  },  "default_locale": "ja"}// 注意: ローカルファイルで / -> /index.html 変換はない https://developer.mozilla.org/en-US/docs/Apps/Manifest
  58. 58. Firefox OS Simulator 再起動不要の拡張機能 https://addons.mozilla.org/ja/ firefox/addon/firefox-os-simulator/ ポチッと押すだけ Web 開発メニューに追加される Firefox デスクトップビルド+ プロファイル+Alpha 詳しい解説: https://github.com/dynamis/firefoxos/wiki/simulator
  59. 59. Firefox OS Simulator (r2d2b2g) プロファイル付きデスクトップビルドにホームボタンを追加 コンソールやディレクトリからアプリケーションを読み込む機能も
  60. 60. シミュレータにインストール Add Directory ボタン manifest ファイルを選択 zip されて packaged app として インストールされ、起動する Update ボタンで更新 同じディレクトリのファイルを zip し直して、起動する https://github.com/dynamis/firefoxos/wiki/simulator
  61. 61. つーるきっととかは? Firefox OS 標準の ライブラリとかあるの?
  62. 62. GAIA Building Blocks (UI 部品) Gaia (Firefox OS 標準) Apps のデザインを簡単に作れる http://buildingfirefoxos.com/ 使っても使わなくても OK 好きな SDK/Library 使える 自由な Web ですから! http://buildingfirefoxos.com/
  63. 63. Marketplace
  64. 64. まーけっと? Web アプリの配信方法は?
  65. 65. Firefox Marketplace Device, OS 横断マーケット Web Platform のためのストア Firefox 限定にならない設計 現在テスター向け公開中 対象は Firefox OS と Android 版 Firefox の開発版ビルド PC で使うには UA 書き換え... https://marketplace.firefox.com/
  66. 66. オープンなアプリストア 全てを Web 技術で実装 安定・平等な環境を提供 Marketplace のソースも公開 ベンダー非依存 Firefox Marketplace 以外にも ストア、認証、課金も自由に https://marketplace.firefox.com/
  67. 67. オープンなレビューシステム コミュニティレビュー Firefox のアドオンと同じ レビュー基準もレビュアーもすべ てオープンで公平なマーケット 動作まではレビューしない あくまで最低限のフィルタhttps://developer.mozilla.org/en-US/docs/Apps/Marketplace_review_criteria
  68. 68. 自分のサイトで配布 install() 関数使うだけ navigator.mozApps.install(url) manifest ファイル URL を渡す その他の Apps API: navigator.mozApps.getSelf() navigator.mozApps.getInstalled() installPackage(url) https://developer.mozilla.org/en-US/docs/Apps/Apps_JavaScript_API
  69. 69. navigator.mozApps.install(url)var Apps = navigator.mozApps;var manifesturl = "http://apps.dynamis.jp/manifest.webapp";var request = Apps.install(manifesturl);request.onsuccess = function() {  // 成功時の処理};request.onerror = function() {  // 失敗時の処理};
  70. 70. Firefox = WebRT (WebRunTime) どろいど君 Gecko は元からアプリ環境とも仲良し! Firefox = Gecko で XUL/JS WebApps = Gecko で HTML/JS マルチデバイス対応 PC, Android, Firefox OS... 同じコードでどこでも動く マーケットもマルチデバイス
  71. 71. Android に Web アプリ環境を Web App = Native App に ホームスクリーンへの追加や 独立してフル画面起動など ネイティブ同様の利用体験 Firefox = WebRT for Androidホームにインストール、アプリを起動した画面、マーケットをブラウズ
  72. 72. PC にも Web アプリ環境を Web App = Native App に プログラムフォルダ (アプリケー ションディレクトリ) への追加 ウィンドウはもちろんプロセスも データも全て独立 Firefox = WebRT for PC
  73. 73. WWeebb だからどこにでも! Web らしいシステムだね!
  74. 74. 実機で開発したい? 僕の手でも使えるかな?
  75. 75. Developer Preview Phone Telefónica と Geeksphone が作る開発者向けテスト端末
  76. 76. Developer Preview Phone 近日発売予定 Keon: Snapdragon 1GHz, 4GB ROM, 512MB RAM, 3.5" HVGA Peak: Snapdragon 1.2GHz x2, 4GB ROM, 512MB RAM, 4.3" qHD http://www.geeksphone.com/
  77. 77. もっと知りたい? 僕はもっと知りたい!
  78. 78. Firefox OS コミュニティを! http://FxOS.org/ (https://groups.google.com/group/ firefoxos にリダイレクト) http://FxOS.org/wiki (https://github.com/dynamis/firefoxos/ wiki にリダイレクト) みんな参加してね。 みんなよろしく!
  79. 79. 質問ある?ぼくには難しいことは分からないけど許してね。
  80. 80. See Also...
  81. 81. 開発者ツール紹介 一通りの機能と使い方 Firefox 標準の開発者ツール 隠し設定やビルトイン関数のリ ファレンスなども含めています Firebug とその拡張機能 アイコンや背景画像を変更する カスタマイズにも言及してます http://r.dynamis.jp/devtools
  82. 82. Web 技術 2012 年の変化 最新 Web 技術動向 2012 年に進化した点やブラウザ ベンダーの動向を紹介 HTML5 から HTML5.1 へ HTML の仕様は進化と安定化が 同時平行で続けられる
  83. 83. JavaScript.Next JavaScript の最新仕様 ECMAScript 5th のポイント JavaScript 次世代仕様 ECMAScript 6th や Harmony http://r.dynamis.jp/jsnext
  84. 84. セキュリティ関連機能紹介 セキュリティ大事! 知っておくべき機能です Content Security Policy 次世代セキュリティポリシー Same Origin Policy はもう古い http://r.dynamis.jp/sec

×