Hoy comparto un pequeño artículo que preparé hace algún tiempo para ayudar a un amigo en un proyecto... No es más que una breve introducción al desarrollo de apps con Phonegap. Por si a alguien más le sirve a modo de "primera orientación":
El SO Android es internamente un LINUX sobre el que corre una máquina virtual para interpretar código Java (muy optimizada).
Android ofrece unas librerías (SDK's), en Java, para interactuar con el sistema. Una app android sería un conjunto de clases Java. Para instalarse una app en Android el sistema operativo requiere un "fichero de instalación" (*.APK), que contendrá básicamente una carpeta "src" con el código de la app (las clases Java), una carpeta "res" con los recursos (textos, imágenes, ...) más un fichero muy importante, el manifiesto "AndroidManifest.xml", donde se indica la clase principal de la app, los permisos que la app necesita sobre android (ej: escribir ficheros, acceder a la cámara, ...) y algunas cosas más...
Entre las librerías que Android ofrece a los desarrolladores hay clases para la interfaz de usuario, que nos dan por ejemplo cajas de texto, checkbox, botones, vistas con scroll para agrupar objetos, vistas web "WebView", etc.
El desarrollo de una app android "nativa" se haría normalmente sobre un entorno de desarrollo (IDE) (los más usados son Eclipse y Android Studio), que tienen sus editores de código e interfaces de usuario, gestores de proyectos, etc..., y que al final tienen una opción de compilar la app y generar el fichero APK.
Un WebView es un control nativo Android que permite meter en una app un "rectángulo en pantalla" dentro del cual meteremos código html que el propio Android interpretará. Desde hace años Android soporta html5, por lo que en estas webviews se podrá meter html5, código javascript y hojas de estilo css.
Aquí entra Phonegap:
Quién quiera desarrollar una app para más de un sistema (Android, iPhone/iPad, Windows Phone...) tendría que hacer algo análogo a lo anterior PARA CADA SISTEMA. Así por ejemplo en iOs pues en lugar de Java hablaríamos de Objective C, entorno de desarrollo Xcode y al final un fichero *.IPA en lugar del APK de Android. Entonces hay "DESARROLLO DOBLE".
¿Qué ha hecho Phonegap?
Phonegap propone un sistema de desarrollo en el que toda la app se programa como si fuera una aplicación web, es decir, un fichero html, y Phonegap se encargará luego de empaquetar ese html dentro de un WebView (o el control equivalente en iOs...) y añadirle el resto de código necesario para que sea una app android (o iOs, o del sistema que sea) completa.
Y además Phonegap se ha encargado de preparar una API con clases EN JAVASCRIPT para acceder a los recursos del sistema (cámara, GPS, contactos, almacenamiento, etc...).
De esta forma nos movemos dentro de una app phonegap con "enlaces html", que en algunos casos serán llamadas a funciones "javascript" para acceder a recursos del sistema.
A la hora de compilar Phonegap se encargará de traducir esas llamadas javascript a las clases específicas nativas de la plataforma para la que estemos compilando.
Para cosas muy específicas que no estén en la API de Phonegap hay un sistema previsto para la creación y uso de plugins... (ej: Lector de códigos de barras o QR, compartir en redes sociales, ...)
¿Y cómo se desarrolla en Phonegap?
Hay varias formas. Una de ellas podría ser integrar el motor de Phonegap en Eclipse y desde allí desarrollar, probar y compilar...., otra sería hacer los html con el editor que más nos guste (valdría desde un simple "bloc de notas") y luego compilar desde línea de comandos (CLI) (una opción que ofrece la instalación de Phonegap) y otra es Phonegap Build.
Phonegap Build es un servicio de Adobe que permite "compilación en la nube". Es decir, en local montamos una carpeta para nuestro proyecto, con un index.html, que será el inicio de la app, más las carpetas y ficheros que necesitemos (hojas css, imágenes, etc.). En ese fichero html referenciamos a clases javascript que nos da phonegap para usar las funciones de phonegap (ej: guardar datos en el móvil, hacer una foto, ...). Y cuando esté listo el/los html empaquetamos nuestra carpeta en un ZIP y lo subimos a nuestra cuenta de Phonegap Build. Allí elegimos para qué plataforma/s queremos compilar (iOs, Android, Windows Phone) y en segundos tenemos nuestros ficheros compilados disponibles para la descarga.
NOTAS:
- Para distribuir las apps a través de las principales App Stores éstas tienen que ir firmadas; phonegap build permite subir nuestros certificados para firmar con ellos.
- Phonegap build es un servicio de pago, pero la opción básica (gratuita) permite usar el servicio para 1 aplicación privada e ilimitadas apps que sean de código público.
Al final por tanto tenemos en nuestro equipo el fichero necesario para poder subirlo a la/s appstores donde vayamos a distribuirlas.
Y esto sería la arquitectura "base" de la app.
Luego, para la app en sí podemos hacerlo todo en html "a pelo" o bien usar alguna/s herramientas/frameworks de apoyo (ej: jquery, jquerymobile, ...).
NOTA FINAL:
De la forma descrita cada vez que quisiéramos probar nuestra app habría que subirla a Phonegap Build, compilarla, bajarla y pasarla a nuestro móvil. Para agilizar el desarrollo la gente de Phonegap Build nos facilitan Phonegap App (http://app.phonegap.com/), que es una app (disponible para las 3 plataformas) que instalamos en nuestro móvil para testear.
¿Cómo funciona?
Básicamente en nuestro equipo ejecutamos el comando "phonegap serve" y luego en la app (que corre en el móvil conectado vía wifi a la misma LAN donde está el PC) indicamos la dirección IP (+puerto) de nuestro equipo. De esta forma es la app del móvil la que "en tiempo real" interpreta las llamadas javascript para pasarlas a nativas.
---
Enlaces relacionados:
ANDROID
PHONEGAP
PHONEGAP BUILD
