Front In Fortaleza - WebAPIs
-
Upload
fabio-magnoni -
Category
Internet
-
view
141 -
download
2
description
Transcript of Front In Fortaleza - WebAPIs
![Page 1: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/1.jpg)
!
#FirefoxOS
Front In Fortaleza !
![Page 2: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/2.jpg)
Fábio Magnoni
@FabioMagnoni
#FirefoxOS
![Page 3: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/3.jpg)
![Page 4: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/4.jpg)
![Page 6: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/6.jpg)
![Page 7: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/7.jpg)
![Page 8: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/8.jpg)
![Page 9: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/9.jpg)
![Page 10: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/10.jpg)
![Page 11: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/11.jpg)
![Page 12: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/12.jpg)
Meidin Camelô…
![Page 13: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/13.jpg)
38 bilhões de dispositivos !conectamos !
em 2020
ABI Research - 2013-05-09 - http://j.mp/38billion!
![Page 14: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/14.jpg)
Você deveria começar com a web…
![Page 15: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/15.jpg)
![Page 16: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/16.jpg)
![Page 17: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/17.jpg)
Mobile Internet Users Desktop
![Page 18: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/18.jpg)
Plataformas !
![Page 19: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/19.jpg)
A Web está ganhando!!!
![Page 20: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/20.jpg)
A Web é a Plataforma
![Page 21: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/21.jpg)
Vamos começar com o que você merece!
![Page 22: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/22.jpg)
![Page 23: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/23.jpg)
Feito com a Web
Usando HTML5, CSS3 e JavaScript!Com uma série de APIs!para desenvolver apps.!
![Page 24: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/24.jpg)
![Page 25: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/25.jpg)
É open source
![Page 26: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/26.jpg)
![Page 27: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/27.jpg)
GONK
![Page 28: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/28.jpg)
Infrastructure Layer (Gonk)
RILd
AccelGPSCamera
Power Mgt
Audio /
Video
Open GLES
Input / Touch
Open Source Libraries
Bluetooth USB
LEDs HW
Buttons
Vibrator
OEM Libs
Device’s Operationg System
Linux Kernel OEM Drivers OEM Modem Firmware
![Page 29: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/29.jpg)
GECKO
![Page 30: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/30.jpg)
Open Web Platform Interface
Contacts
Sensors GeoLocation
Battery Vibration
Camera Media
Storage WebRTC
Alarms System
Messages
System XHR
NFC Bluetooth
WebTelephony WebSMS/MMSSettings
Gecko Engine
Security
Web APIs
Open WebApps APIs
Network Connections
/ UICC
mozPay /Trusted
UI
WebActivities
HTML5 APIs
![Page 31: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/31.jpg)
GAIA
![Page 32: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/32.jpg)
JS Libraries For Developers
Core - Certified
Apps System
AppUtility
Libraries Building Blocks
GaiaHosted Apps
Trusted Packed Apps
Application Layer HTML5 / JS / CSS
![Page 33: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/33.jpg)
{ "version": "1.0", "name": “Mozilla", "description": "Exciting Open Web development action!", "icons": { "16": "/img/icon-16.png", "48": "/img/icon-48.png", "128": "/img/icon-128.png" }, "developer": { "name": "Mozilla Labs", "url": "http://mozillalabs.com" }, "installs_allowed_from": ["*"], "appcache_path": "/cache.manifest", "locales": { "es": { "description": "¡Acción abierta emocionante del desarrollo del Web!", "developer": { "url": "http://es.mozillalabs.com/" } }, "pt-BR": { "description": "Descrição da sua aplicação!", "developer": { "url": "http://pt-BR.mozillalabs.com/" } } }, "default_locale": "en" }
![Page 35: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/35.jpg)
Empacotadas vs. Hospedadas
![Page 36: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/36.jpg)
Segurança
![Page 37: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/37.jpg)
Apps
Conteúdo Web
Conteúdos Web Padrão
Web Apps Privilegiadas
Mais acesso, mais responsabilidade
Web Apps Instaladas
Web App Normal
Web App Certificada
Apps Críticas ao dispositivo
![Page 38: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/38.jpg)
Permissões
https://developer.mozilla.org/en-US/Apps/Developing/App_permissions
![Page 39: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/39.jpg)
"permissions": { "contacts": { "description": "Required for autocompletion in the share screen", "access": "readcreate" }, "alarms": { "description": "Required to schedule notifications" } }
![Page 40: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/40.jpg)
![Page 41: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/41.jpg)
WEB APIs
![Page 42: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/42.jpg)
Vibration API (W3C)
Screen Orientation
Geolocation API
Mouse Lock API (W3C)
Open WebApps
Network Information API (W3C)
Battery Status API (W3C)
Alarm API
Web Activities
Push Notifications API
WebFM API
WebPayment
IndexedDB (W3C)
Ambient light sensor
Proximity sensor
Notification
WEB APIS (PRA GALERA)
![Page 43: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/43.jpg)
API STATUS DA BATERIA
![Page 44: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/44.jpg)
var battery = navigator.battery; if (battery) { var batteryLevel = Math.round(battery.level * 100) + "%", charging = (battery.charging)? "" : "not ", chargingTime = parseInt(battery.chargingTime / 60, 10, dischargingTime = parseInt(battery.dischargingTime / 60, 10); // Set events battery.addEventListener("levelchange", setStatus, false); battery.addEventListener("chargingchange", setStatus, false); battery.addEventListener("chargingtimechange", setStatus, false); battery.addEventListener("dischargingtimechange", setStatus, false); }
![Page 45: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/45.jpg)
NOTIFICAÇÃO
![Page 46: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/46.jpg)
var notification = navigator.mozNotification; notification.createNotification( "See this", "This is a notification", iconURL );
![Page 47: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/47.jpg)
API ORIENTAÇÃO DE TELA
![Page 48: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/48.jpg)
// Portrait mode: screen.mozLockOrientation("portrait"); /* Possible values: "landscape" "portrait" "landscape-primary" "landscape-secondary" "portrait-primary" "portrait-secondary" */
![Page 49: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/49.jpg)
API VIRAÇÃO
![Page 50: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/50.jpg)
// Vibrate for one second navigator.vibrate(1000); // Vibration pattern [vibrationTime, pause,…] navigator.vibrate([200, 100, 200, 100]); // Vibrate for 5 seconds navigator.vibrate(5000); // Turn off vibration navigator.vibrate(0);
![Page 51: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/51.jpg)
API INFO DE REDE
![Page 52: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/52.jpg)
var connection = window.navigator.mozConnection, online = connection.bandwidth > 0, metered = connection.metered;
![Page 53: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/53.jpg)
API DE PROXIMIDADE
![Page 54: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/54.jpg)
window.addEventListener("deviceproximity", function (event) { // Current device proximity, in centimeters console.log(event.value); // The maximum sensing distance the sensor is // able to report, in centimeters console.log(event.max); // The minimum sensing distance the sensor is // able to report, in centimeters console.log(event.min); });
![Page 55: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/55.jpg)
API EVENTOS ILUMINAÇÃO
![Page 56: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/56.jpg)
window.addEventListener("devicelight", function (event) { // The level of the ambient light in lux console.log(event.value); });
![Page 57: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/57.jpg)
window.addEventListener("devicelight", function (event) { // The lux values for "dim" typically begin below 50, // and the values for "bright" begin above 10000 console.log(event.value); });
![Page 58: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/58.jpg)
Device Storage API
Browser API
TCP Socket API
Contacts API
systemXHR
WEB APIS (PRIVILEGIADAS)
![Page 59: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/59.jpg)
DEVICE STORAGE
![Page 60: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/60.jpg)
var deviceStorage = navigator.getDeviceStorage("videos");
![Page 61: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/61.jpg)
// "external", "shared", or "default". deviceStorage.type; // Add a file - returns DOMRequest with file name deviceStorage.add(blob); // Same as .add, with provided name deviceStorage.addNamed(blob, name); // Returns DOMRequest/non-editable File object deviceStorage.get(name); // Returns editable FileHandle object deviceStorage.getEditable(name); // Returns DOMRequest with success or failure deviceStorage.delete(name); // Enumerates files deviceStorage.enumerate([directory]); // Enumerates files as FileHandles deviceStorage.enumerateEditable([directory]);
![Page 62: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/62.jpg)
var storage = navigator.getDeviceStorage("videos"), cursor = storage.enumerate(); cursor.onerror = function() { console.error("Error in DeviceStorage.enumerate()", cursor.error.name); }; cursor.onsuccess = function() { if (!cursor.result) return; var file = cursor.result; // If this isn't a video, skip it if (file.type.substring(0, 6) !== "video/") { cursor.continue(); return; } // If it isn't playable, skip it var testplayer = document.createElement("video"); if (!testplayer.canPlayType(file.type)) { cursor.continue(); return; } };
![Page 63: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/63.jpg)
API DE CONTATO
![Page 64: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/64.jpg)
var addContact = document.querySelector("#add-contact"); if (addContact) { addContact.onclick = function () { var newContact = new MozActivity({ name: "new", // Possibly add-contact in future versions data: { type: "webcontacts/contact", params: { // Will possibly move to be direct properties under "data" giveName: "Fabio", familyName: "Magnoni", tel: "+5519988013586", email: "[email protected]", address: "Campinas", note: “Se tiver cerveja envolvida, pode entrar em contato :)”, company: "Mozilla" } } }); } }
![Page 65: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/65.jpg)
Apps Certificadas = Apps SO
![Page 66: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/66.jpg)
Dialer !Contacts !Settings !SMS !Web browser !Gallery !Video Player !Music Player !E-mail (POP, IMAP) !Calendar
Alarm Clock !Camera !Notes !First Run Experience !Notifications !Home Screen !Mozilla Marketplace !System Updater !Localization Support
![Page 67: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/67.jpg)
WEB ACTIVITIES
![Page 68: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/68.jpg)
![Page 69: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/69.jpg)
var activity = new MozActivity({ name: "view", data: { type: "image/png", url: ... } });
activity.onsuccess = function () { console.log("Showing the image!"); };activity.onerror = function () { console.log("Can't view the image!"); };
![Page 70: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/70.jpg)
{ "activities": { "share": { "filters": { "type": ["image/png", "image/gif"] } "href": "sharing.html", "disposition": "window" } } }
![Page 71: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/71.jpg)
var register = navigator.mozRegisterActivityHandler({ name: "view", disposition: "inline", filters: { type: "image/png" } }); register.onerror = function () { console.log("Failed to register activity"); }
![Page 72: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/72.jpg)
navigator.mozSetMessageHandler("activity", function (a) { var img = getImageObject(); img.src = a.source.url; // Call a.postResult() or a.postError() if // the activity should return a value });
![Page 73: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/73.jpg)
Como instalar App da Web
var install app = navigator.mozApps.install(manifestURL); installapp.onsucess = function(data) { //App is installed };installapp.onerror = function() { //App wasn’t installed, info is in // installapp.error.name};
![Page 74: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/74.jpg)
Cordova & Phonegap
![Page 75: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/75.jpg)
Implementação das APIs
• Câmera • Contatos • Dispositivo • Device-motion • Geolocation • Orientação • Vibração
![Page 76: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/76.jpg)
Se preparando
$ sudo npm install -g cordova$ cordova create hello com.example.hello HelloWorld$ cd hello$ cordova platform add firefoxos$ cordova prepare firefoxos
![Page 77: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/77.jpg)
API de Camera
$ cordova plugin add org.apache.cordova.camera!!//Cordova codenavigator.camera.getPicture(function (src) { var img = document.createElement('img'); img.id = 'slide'; img.src = src; }, function () {}, { destinationType: 1});!
![Page 78: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/78.jpg)
Firefox OS App Manager + Simulador (1.2+)
![Page 79: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/79.jpg)
Firefox Developer Tools
![Page 82: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/82.jpg)
FIREFOX OS BOILERPLATE APP
https://github.com/robnyman/Firefox-OS-Boilerplate-App
![Page 85: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/85.jpg)
Prototipe com JSFiddle• Insira /webapp.manifest
para instalar o app no simulador do Firefox OS
!
• Insira /fxos.html para ter uma página de instalação como um app Firefox OS hospedado
![Page 88: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/88.jpg)
ComponentesAppbar !Calendar !Deck !Flipbox !Layout !Slideshow !Slider !Tabbar !Toggle !Tooltip
![Page 91: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/91.jpg)
![Page 92: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/92.jpg)
![Page 93: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/93.jpg)
![Page 94: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/94.jpg)
https://lists.mozilla.org/listinfo/dev-webapps
irc://irc.mozilla.org/ #openwebapps
![Page 96: Front In Fortaleza - WebAPIs](https://reader038.fdocumentos.tips/reader038/viewer/2022102815/554f7a78b4c905435d8b46bf/html5/thumbnails/96.jpg)