Apps days ffos_parte1

Taller Firefox OSApp Days

1

Pablo SepúlvedaDevelopment Eng. LeadFirefox OS Launch TeamMozilla Chile

Mozilla, su misión

2Taller Firefox OS App Days

● Una comunidad global de personas que creemos en la libertad, innovación, y oportunidad son las claves para mantener internet viva y accesible para todos


● Internet es un recurso publico global que debemos mantener libre y accesible.

● Internet debe enriquecer la vida de los seres humanos.

● La seguridad y privacidad de los usuarios en Internet son fundamentales y no deben ser tratados como algo opcional.

● Los usuarios deben tener la posibilidad de moldear Internet y su propia experiencia en Internet.

¿Open Web?


Comunidad y Proyectos● Comunidad de Mozilla en Chile - http://mozillachile.cl● Comunidad Mozilla Hispano - http://mozilla-hispano.org● Comunidad Global - http://mozilla.org

Proyectos● Webmaker, SUMO, QA, MDN, Difusión, Localización, Desarrollo

web, Firefox Marketplace, Complementos, Firefox OS, etc.

http://mozillachile.cl/

http://mozilla-hispano.org/

http://mozilla.org/


Team Mobilizer Chile

● Propósito: centrado en los usuarios y la difusión de Firefox OS.● Grupo en Facebook:

https://www.facebook.com/groups/mobilizerchile/● Fiesta Mobilizer Chile

https://www.facebook.com/groups/mobilizerchile/

Introducción a Firefox OS


¿Qué es Firefox OS?


● Nombre clave: Boot to Gecko – B2G.

● Un nuevo ecosistema de sistemas operativos móviles basados en HTML5.

● Un “nuevo” concepto: Aplicaciones web móviles →multiplataforma.

Firefox OS: Algo de Historia


● 2010:– Mozilla Labs publica un video de SeaBird,

idea de S.O. basado en Android.– Ese mismo año, Mozilla lanza Open Web

Apps (marketplace).– Telefónica da pie a una iniciativa junto a

AT&T para crear un S.O. móvil basado en webkit (WAC).

● 2011:– Mozilla inicia el Proyecto B2G. Se lanza un

pre-alpha.– Telefónica fracasa con el WAC.



● 2012:– En febrero, se lanza la versión 1.0.– Telefónica anuncia apoyo a la Fundación Mozilla por B2G.– En julio, cambia el nombre de B2G a Firefox OS.

– En octubre, Mozilla estrena el Firefox Marketplace.



● 2013:– Pactos de cooperación con

LG, Alcatel, ZTE, Huawei.– En septiembre, se lanza la

versión 1.0.1.– Lanzamiento de la línea de

Geeksphone.– En octubre, se lanza la

versión 1.1.– Lanzamientos en España,

Brasil, México,Venezuela, entre otros.

– En diciembre, se lanza la versión 1.2.



● 2014:– En enero, se anuncia a Panasonic

como nuevo partner y la inclusión de Firefox OS en Smart TV's. También se anuncia el TCP (Tablet Contribution Program).

– En febrero, se lanza en Chile con el dispositivo Alcatel One Touch Fire.

– Cadena de lanzamientos en Sudamérica.

– En marzo, se lanza la versión 1.3, actual estable oficial.– En junio, se lanza la versión 1.4. Además se anuncia el

lanzamiento del Flame (Firefox OS Developer phone).– En julio, se lanza la versión 2.0. Versión 2.1 pre-release.– Lanzamientos en Centroamérica.– En octubre, se proyecta el lanzamiento de la versión 2.1.

Firefox OS en la Actualidad


● Versión estable: 1.3● Operadoras: Telefónica

y sus distintas filiales (principal), América Móvil (México), operadoras chinas, coreanas, alemanas, entre otras.

● Firefox OS en el mundo: Brasil, Chile, Colombia, El Salvador, Francia, Alemania, Grecia, Hungría, Italia, Montenegro, México, Perú, Polonia, Rusia, Serbia, España, Reino Unido, Estados Unidos, Uruguay, Venezuela... y la lista sigue.

Arquitectura de Firefox OS


● Basado en HTML5 y con kernel Linux.

● Consta de las siguientes capas principales de abstracción representadas en la imagen.

Arquitectura de Firefox OS


En palabras simples:

● Gonk: es el sistema operativo de bajo nivel de Firefox OS, consiste en un kernel Linux y una capa de abstracción de hardware de espacio de usuario (HAL).

● Gecko: es el motor de renderizado que provee todo el soporte para HTML, CSS y JavaScript. Esto hace que dichas APIs funcionen bien en cualquier sistema operativo que soporte Gecko.

● Gaia: es la interfaz de usuario de la plataforma Firefox OS. Está implementado completamente usando HTML, CSS y JavaScript.

● Haida: interfaz sucesora de Gaia. Implementación parcial desde la v1.4 y completa desde la v2.0.

Entorno de Desarrollo


● Desde las últimas versiones de Firefox y derivados.

● Se accede mediante about:app-manager

● Administrador de apps, debug, simulador... todo en un par de complementos.

● Sin SDKs = KISS.

Hola Mundo en Firefox OS


● Dos archivos a tener en cuenta: index.html y manifest.webapp.

● Creamos una carpeta “hola-mundo” y dentro de ella los dos archivos mencionados anteriormente.



● En index.html:<!DOCTYPE html><html>

<header><title>Prueba en Firefox OS</title><style>

body{text-align: center;

}</style>

</header><body>

<h1>Prueba</h1><p>

Hola mundo desde Firefox OS :-)</p>

</body></html>



● En manifest.webapp:{ "version": "1.0", "name": "Hola Mundo", "launch_path": "/index.html", "description": "Prueba en Firefox OS", "icons": { "128": "/images/logo128.png" }, "developer": { "name": "Pablo Sepúlveda", "url": "http://www.psep.cl" }, "installs_allowed_from": ["*"], "default_locale": "es", "permissions": { }}



● Habrán notado que el archivo manifest.webapp no es más que un JSON.

● El manifest es el más importante y primordial componente de nuestra aplicación. Realiza todas las indicaciones de instalación y ejecución en Firefox OS.

Lo que se viene: WebIDE


● Si bien, para desarrollar apps no es necesario más que un editor de texto, Mozilla a incorporado un IDE totalmente web.

● Se encuentra disponible en las versiones de Firefox Nightly. Este es la evolución del app-manager.

● Se activa en el browser, cambiando a true el parámetro “devtools.webide.enabled” en el about:config

Lo que se viene: WebIDE


Aplicaciones


● Con un manifest.webapp es posible convertir cualquier página web en una “webapp”.

● Esto indicando en el atributo “launch_path” la url del index de la web.

● ¿Es real la dependencia de internet en las apps de Firefox OS?– Depende del tipo de aplicación.

Tipos de Aplicaciones


● App Hosteada: es una página alojada en un servidor web. Requiere conexión a internet.

● App Empaquetada: posee todo sus recursos (html, css, js, manifest, etc.) comprimidos en un archivo zip. No requiere conexión a internet.

● Más info en MDN: http://mzl.la/1pDgQm0

Technology

Apps days ffos_parte1