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 アプリ

45,919 views

Published on

ついに国内での商用端末も発売になった Firefox OS。その特徴はアプリがHTML5 を使って作成できることです。HTMLやCSS、JavaScriptを使って作成したページ にマニフェストを足すだけでアプリとなります。このセッションではFirefox OS とそのエコシステムを、アプリ作成という視点から概観します。Firefox OSの仕 組みやAPIだけではなく、開発環境の構築からFirefox Marketplace へのアプリ の登録、公開されたアプリのバージョンアップといった、アプリの作成の流れを 一通りご紹介します。このセッションが契機となって、Firefox OSのアプリ作成 に興味をお持ちの方が一人でも増えれば幸いです。

Published in: Technology

つくろう!Firefox OS アプリ

  1. 1. 

  2. 2.
  3. 3.
  4. 4.
  5. 5. { "name": "My App", "description": "My elevator pitch goes here", "launch_path": "/index.html", "icons": { "16": "/img/icon-16.png", … }, "developer": { "name": "Your name or organization", "url": "http://your-homepage-here.org" }, "default_locale": "ja" }
  6. 6. https://developer.mozilla.org/Apps/Design/Firefox_OS_building_blocks
  7. 7. https://github.com/mozilla-b2g/gaia/tree/v2.0/shared/style
  8. 8. https://developer.mozilla.org/docs/Tools/WebIDE
  9. 9. • 普通のFirefoxでも開発できますが、
 開発者が必要とする機能が充実しているため、
 こちらのほうが効率良く開発が行えます。 • https://mozilla.org/firefox/channel/ 
 よりダウンロードできます
  10. 10. 
 
 
 

  11. 11. var sdcard = navigator.getDeviceStorage("sdcard"); var file = new Blob(["This is a text file."], {type: "text/plain"}); var request = sdcard.addNamed(file, "my-file.txt"); request.onsuccess = function () { var name = this.result; console.log('File "' + name + '" successfully wrote on the sdcard storage area'); } // An error typically occur if a file with the same name already exist request.onerror = function () { console.warn('Unable to write the file: ' + this.error); }
  12. 12. var name = navigator.mozCamera.getListOfCameras()[0]; var streamReady = function(stream){ var display = document.querySelector("video"); display.mozSrcObject = stream; display.play(); }; var success = function(camera){ camera.getPreviewStream(size, streamReady); }; var fail = function(error){}; navigator.mozCameras.getCamera(name, {}, success, fail);
  13. 13. var req = new MozActivity({ name: "pick", data: { type: "audio/mpeg" } }); req.onsuccess = success; var success = function(){ var music = this.result; // do something };
  14. 14.
  15. 15.
  16. 16. https://marketplace.firefox.com/
  17. 17.
  18. 18.
  19. 19.
  20. 20. 
 
 
 


×