Aplicaciones web en Chrome y Android

Google ha desarrollado, o mejor dicho, esta desarrollando una serie de herramientas para poder desarrollar aplicaciones Chrome que se ejecuten tanto en Android como en iOS como si fueran nativas basadas en Apache Cordova, hacia donde ha derivado este proyecto ya que estas herramientas están aun en un estado de desarrollo muy temprano.

            Se pueden empaquetar las aplicaciones Chrome para ser distribuidas por medio de Google Play o App Store.

            Estas aplicaciones estan desarrolladas con HTML, CSS y Javascript, que son los lenguajes con los que se trabaja en Apache Cordova.

            En la documentación de Chrome Apps Developer Tools, podemos ver las direcciones de trabajo que nos indican el proceso desde la creacion de la app, hasta su ejecución. Siendo estos dos caminos:

• Por medio de la línea de comandos
• A través del IDE o del SDK de las plataformas XCode o Eclipse

(Como podemos observar muy similar a Apache Cordova, por no decir que idéntico.)

            De hecho esta forma de trabajo pone a nuestra disposición todas las APIs de Apache Cordova.

            Para comenzar a desarrollar en este sistema existen una serie de aplicaciones de ejemplos y un proyecto en gitgub.

            De hecho tras investigar un poco, podemos ver que para desarrollar en la tecnología de Chrome, son necesarios los mismos requisitos que para Cordova o Phonegap:

• nodejs
• JAVA JDK 7
• Andorid SDK version 4.4.2
• Apache-ant

            A la hora de desarrollar proyectos, emular dispositivos... tan solo hay que cambiar la palabra cordoba por cca:

Chrome	Cordova
cca create HolaMundo	cordova create HolaMundo
cca emulate android	cordova emulate android
cca run android	cordova run android

            Incluso para realizar cambios en nuestros códigos HTML, CSS y Javascript es necesario acceder al directorio www.

            De hecho en la propia documentación puesta en githud:

(https://github.com/MobileChromeApps/mobile-chrome-apps/blob/master/docs/CordovaConsiderations.md) sobre el proyecto, derivan a ciertas consideraciones que hay que tener cuando se desarrolla en Chrome.

            Las diferencias más notables que hemos podido encontrar son:

• En la tecnología desarrollada por Chrome, en principio solo se puede desarrollar para Android e iOs, mientras que en Apache Cordova entran también windows phone, windows 8 y BlackBerry
• La forma de subir las aplicaciones a Play Store es directa con Chrome con tan solo una secuencia de comandos, mientras que no ocurre esto en Apache Cordova.

Cuidad vuestras mascotas

Hemos comenzado la producción de una nueva aplicación bajo Cordova. Esta aplicación será un juego basado en el "lindo gatito", el cual conocemos muy bien todos. Pero esta vez la mascota será el logotipo de Cordova.

Primero decidimos que lo íbamos a basar en el clásico tamagotchi; así pues la mascota comerá, dormirá, jugará, hasta hará sus propias cacas. Pero el peso importante lo tenemos que decantar con la utilización de los plugins más punteros. Hemos decidido la introducción de: una pantalla de carga para usar splashscreen, que los mensajes los mostráramos en dialogs, el uso del acelerómetro para jugar con tu mascota, mostrar contenido web con ayuda de inappbrowser, vibración para alertar al jugador, almacenamiento de mascotas difuntas en bases de datos...

El siguiente paso obligatorio sería el diseño del mock-up para ayudarnos a estructurar y agilizar el desarrollo de la aplicación. Primero trasladado en papel como bocetos y luego digitalizado para la posterior documentación a presentar.

Entonces actualmente nos encontramos con la mayoría de ventanas ya programadas, un interfaz completamente definido a falta de la funcionalidad del "bichito", iconos y botones ya diseñados, logotipo finalizado y trabajando la documentación a la par.

Documentación Version 1.0

Por fin hemos culminado el trabajo con el exelearning, la documentación esta completa para realizar proyectos utilizando casi cualquier plugin, evento, e incluso bases de datos.
En esta versión 1.0, se pueden encontrar:

• La instalación y los requisitos mínimos para que tu maquina pueda crear proyectos en Apache Cordova.
• Como crear una aplicación desde cero, creando el proyecto y utilizar html5 y css3 para ello
• Los plugins y eventos más importantes con ejemplos, vídeos demostrativos y enlaces a proyectos completos.
• Información básica sobre la lectura, creación y borrado de archivos
• Almacenamiento de datos por medio de la BD; SQLite
• Como utilizar la línea de comandos (CLI)
• Utilización del archivo config.xml
• Como utilizar la privacidad con Apache Cordova y algunos consejos para que esta no se rompa.
• Listas blancas
• Como actualizar a la última versión de Apache Cordova.

Para acceder a esta documentación haz click sobre la imagen, y estarás listo para hacer tus propias aplicaciones en Android en muy poco tiempo.

 

Nota: Esta versión esta pendiente de la revisión gramatical y ortográfica final.

Aplicación real con Apache Cordova

Como parte del proyecto, y con el fin de poder trabajar en él durante las prácticas, propusimos a la empresa, ZPAS.net, hacerle una aplicación para ellos, cuya página ni ten siquiera es responsive.
En respuesta ellos nos dijeron que querían una especie de presentación tipo catalogo, y es lo que le estamos haciendo, aunque aun estamos en la fase de desarrollarlo tipo web, podemos determinar varias cosas:

• Las transiciones, overs, focus... de css3 no funcionan bien y hemos tenido que no recurrir a ellas
• Se debe de producir primero en formato web local para poder desarrollarla entera y después introducir todos los plugins de Cordova y utilizarlos.

Esperamos tenerla terminada para dentro de poco, aunque como es normal, ahora mismo no podemos mostrar mucho, ya que esta en desarrollo, pero aun así ponemos aquí el menú principal.

Primero incursión DataStorage

Hemos querido implementar un par de aplicaciones que nos sirviera para comprobar el manejo de bases de datos. Por un lado ha imperado el almacenamiento por Web SQL Database que se ha enfrentado al LocalStorage.

Ambos cuentan con sentencias potentes; por un lado el Web SQL se sirve de sentencias en lenguaje SQL, mucho más numerosas y potentes pero hay que remarcar que la W3C ha dejado de darle soporte ( no por ello, signifique que no podemos seguir utilizándola ). El LocalStorage utiliza menos sentencias y la disposición de sus datos se basa en claves y valores indexados.

La primera prueba sobre LocalStorage daba positivo pero en un navegador web convencional como en el que teníamos en nuestra máquina. Sin embargo al portarlo a Apache Cordova, la aplicación no lanzaba ningún resultado satisfactorio. Simplemente no aparecían los valores y claves que habíamos introducido. Aún tratamos de esclarecer porque funciona en un navegador y no en la aplicación nativa.

La segunda apuesta por Web SQL guarda y muestra bien los datos en toda la ejecución de la aplicación sin embargo, desconocemos donde se encuentran estos datos almacenados.

De ahí nuestro interés de que podamos administrar dichos datos para guardarlos en ficheros de extensión .sql por ejemplo. Será nuestra próxima arremetida contra este inconveniente.

Llega Apache Cordova 3.5

Durante la realización de este proyecto, Apache Cordova a pasado a su versión 3.5, esto ha modificado algunas cuestiones en el desarrollo aunque en esencia sigue siendo el mismo.
Los cambios más importantes han sido:

• El código común entre cordova-cli y cordova-plugman se ha mudado a su propio repositorio llamado cordoba-lib
• Cada plataforma cuenta ahora con un archivo llamado package.json que se ha subido a NGP. Las futuras actualizaciones de cordova.cli harán uso de npm para las plataformas de carga
• Caída del apyo de iOS 5.0 y de arm64. Desde ahora los proyectos se crean en código binario universal de 64 y 32 bits requiriendo como mínimo el despliegue en iOS 6.0
• Esta será la última versión con soporte para Windows Phone 7
• Se ha añadido soporte para Chrome devtools, con versiones de depuración de amazon-fireos.

Para actualizar su proyecto en la plataforma que desee, modifique andorid por su plataforma

npm install -g cordova
cd my_project
cordova platform update android

Fuente

Documentación en la red

Ya hemos subido la primera versión de la documentación a Internet, hemos creado un subdominio de hostinger donde poder alojarla y ya puede visitarse.
Para acceder a ella haz click sobre el icono de Apache cordova: