webapps, caso de estudio y publicación de aplicaciones en firefox os

Webaspp, caso de estudio & publicación

en FirefoxOSJorge Ferreiro - 28/11/2014

¿Qué es una webapp?

Versión optimizada de una página web para dispositivos móviles

¿Qué es una webapp? @jgferreiro

• Sin Actualizaciones: el usuario siempre accederá a la última versión disponible.

• Multiplataforma: un diseño, múltiples dispositivos del mercado.

• Flexibilidad: Cualquier sitio web con diseño responsive puede ser una webapp.

Ventajas de una webapp @jgferreiro

• Rendimiento: las aplicaciones nativas suelen tener una mejor performance.

• Limitaciones en algunas Apis.

• Es necesario utilizar frameworks, como phonegap, para publicar aplicaciones web en Google Play o en la App Store.

Contras de una webapp @jgferreiro

Ejemplos de webapps

Candy rain 2 CameranOpenwapp

Ejemplos de webapps @jgferreiro

¿Cómo crear una webapp?

+ +HTML5 JS CSS3

Combinando

¡Mix de tecnologías! @jgferreiro

Herramienta útil: Firefox OS simulator

Nuestro kit de herramientas @jgferreiro

Web webapp?

Si la idea es convertir una web en una webapp… ¿Cómo lo hacemos?

App manifest

Obligatorio!

Archivo JSON que se configuramos según las necesidades de la aplicación.

App manifest: options @jgferreiro

Locales: Seleccionamos los idiomas de nuestra aplicación.

App manifest: options @jgferreiro

Permisos: Indicamos las APIs que usamos: contactos, alarma, notificaciones, geolocalización...

Más información sobre el App manifest:https://developer.mozilla.org/es/Apps/Build/Manifest#permisos

App manifest: options @jgferreiro

Mi webapp:Music4deejays

Hace unos meses tuve una idea...

Pasión por la música electrónica Hoy en día es muy complicado para artistas emergentes darse a conocer. Me encanta lanzar proyectos que solucionen problemas reales.

¿Y qué me llevó a hacerla?

¿Qué es Music4deejays.com?Plataforma para:

EscucharCompartirDescargar

La mejor Música electrónica de artistas emergentes

Home page

Music4deejays screenshots @jgferreiro

Diseño adaptablea cualquier dispositivo

Music4deejays screenshots @jgferreiro

¿Cómo publicar en FirefoxOS Marketplace?

https://marketplace.firefox.com/developers/submit/

Firefox Marketplace

Publicación @jgferreiro

Tipo de app + ruta del manifest

Publicación @jgferreiro

Error ☹ Hay que configurar el .htacces

AddType application/x-web-app-manifest+json .webapp

Añadir al .htaccess:

Publicación @jgferreiro

Requisitos de la app

AddType application/x-web-app-manifest+json .webapp

Añadir al .htaccess:

Publicación @jgferreiro

Información

AddType application/x-web-app-manifest+json .webapp

Añadir al .htaccess:

Publicación @jgferreiro

Unos pasos más y…

Listo! Ya solo faltan que aprueben nuestra app (de 2 a 5 días)

Publicación @jgferreiro

More information:@Music4deejays

music4deejays.com

• https://marketplace.firefox.com/developers/docs/deploy

• Curso HTML5 para Firefox OS.• Pautas para el desarrollo de aplicaciones• Distribuir tu aplicación

@jgferreiroEnlaces de Interés

¿Alguna pregunta?

Gracias

Keep in touch!@jgferreiro

me@jgferreiro.com