Comenzar con la creación de aplicaciones

Aplicaciones Web son aplicaciones que se construyen usando tecnologías estándares de la web. Ellas funcionan en cualquier navegador web, y pueden desarrollarse usando tus herramientas favoritas. Algunas características que distinguen aplicaciones Web de sitios web:Aplicaciones son instaladas por un usuario, son autónomas y no requieren el crómo de una ventana del navegador, y pueden construirse de manera que puedan funcionar desconectadas. Gmail, Twitter, y Etherpad son aplicaciones Web.

El proyecto de applicaciones Open Web propone agregar pequeños cambios a los sitios que ya existen para convertirlos en aplicaciones que se ejecutan en un rico, divertido, y poderoso medio ambiente informático. Estas aplicaciones se ejecutan en navegadores del escritorio y dispositivos portátiles, y son más fáciles para los usuarios descubrirlos y lanzarlos que sitios web. Ellas tienen acceso a un grupo de características novedosas que está creciendo, como sincronizar todos los dispositivos de un usuario. 

Antes de comenzar

Si es la primera ocasión que quieres desarrollador aplicaciones web, es posible que desees revisar o leer el documento que habla acerca del estado de la API y quizás deberías utilizar la versión beta de Firefox (Firefox 11) para comenzar.

Publicar la aplicación

Lo único que tienes que hacer para convertir un sitio web en una aplicación web es agregar un archivo app manifest. Este es un archivo JSON que describe la aplicación, incluyendo nombre, iconos y descripción legible de la misma.

El manifiesto debe estar alojado en el mismo dominio que su sitio web, y debe tener un
Content-Type application/x-web-app-manifest+json. Para más detalles sobre el archivo app manifest  puedes ir a la  documentación, y para comenzar a escribir dicho archivo puedes apoyarte de la siguiente herramienta online manifest checker.

Determinar si la aplicación esta instalada

Cuando un navegador web abre la pagina de la aplicación, es necesario comprobar que el usuario no la tenga instalada. Puedes comprobar si la aplicacion está instalada usando la llamada amInstalled() como en este ejemplo:

function installCheck(data) {
    if (data) {
        // Si, la aplicación esta instalada
        // data.manifest contiene el manifiesto
        // data.install_time guarda cuando fue instalada
        // data.install_origin es el dominio desde el que la aplicación fue instalada
        // data.install_data tiene datos opcionales de la instalación
    } else {
        // ¡no esta instalada!
    }
}

navigator.mozApps.amInstalled(installCheck);

Instalar la aplicación

Puedes distribuir tu aplicación directamente desde tu sitio web. Creando un botón o un enlace que invoque el siguiente código escrito en JavaScript.

// código extra al anterior ejemplo

function installCallback(result) {
    // estupendo :) - muestra un mensaje o redirije a una página (la página de inicio, la de instalación, etc.)
}

function errorCallback(result) {
    // whoops :( - result.code y result.message recogen los detalles del fallo
}

function installCheck(data) {
    if (data) {
        // ...
    } else {
        navigator.mozApps.install(
            "http:/path.to/my/example.webapp",
            {},
            installCallback,
            errorCallback
        );
    }
}

La llamada navigator.mozApps.install() provoca que el navegador lea el manifiesto y pida al usuario di desea instalar la aplicación. Si el usuario acepta, la aplicación es instalada en el navegador.

El segundo parámetro de navigator.mozApps.install() es el argumento install_data, que almacena alguna información en el almacen de datos de aplicaciones instaladas por el usuario. Esta información puede ser sincronizada con otros dispositivos y puede ser recogida por tu aplicación usando la llamada  amInstalled() (ver Determinar si la aplicación está instalada). Por ejemplo:

navigator.mozApps.install(
    "http://path.to/my/example.webapp",
    {
        user_id: "some_user"
    },
    installCallback,
    errorCallback,
);

Promocionar la aplicación

Mozilla está creando un mercado en el que será posible encontrar, opinar, puntuar y facturar usando una infraestructura abierta que pueda ser usada por terceros para crear sus propias tiendas. Pero no es obligatorio que des de alta tu aplicación en la tienda.

La página vista previa del desarrollo de aplicaciones web abiertas es una versión primeriza del mercado de Mozilla. Puedes darte de alta para ver las novedades en el desarrollo de aplicaciones para estar al día del progreso del mercado de Mozilla así como trucos y consejos para la creación de aplicaciones.

Ejecución offline y uso de APIs para dispositivos avanzados

Los navegadores web modernos han añadido una gran cantidad de útiles características para, por ejemplo, permitir a tu aplicación funcionar sin conexión o acceder a las capacidades de tu dispositivo. Aquí hay algunos enlaces de interés:

Almacenar información localmente

La API localStorage proporciona un método de almacenar información del tipo clave-valor de manera persistente de manera que puedas mantener datos de los usuarios que visiten tu aplicación. Si el usuario tiene un navegador moderno como Firefox 4 o posterior o Chrome, también puedes usar IndexedDB para guardar datos estructurados en una base de datos en cliente de gran rendimiento.

Si tu tienes datos que deberían ser compartidos entre instancias de tu aplicación en diferentes dispositivos que use el mismo usuario, deberías usar la opción install_data de la función install() descrita arriba para guardar la información.

Ejemplos

Algunos ejemplos de aplicaciones web:

Etiquetas y colaboradores del documento

Colaboradores de esta página: manfontan
Última actualización por: manfontan,