desarrollo rápido de aplicaciones móviles híbridas con html5, javascript y css
TRANSCRIPT
1
Resumen—El uso de dispositivos móviles está creciendo muy
rápido y usan diferentes sistemas operativos por lo que se hace
muy difícil mantener el desarrollo de aplicaciones para estos y
llevarle el paso a la actual tendencia de desarrollo orientado a
dispositivos móviles; para esto surgen frameworks* que nos
permiten desarrollar aplicaciones móviles usando HTML5, CSS y
JavaScript ahorrándonos tiempo de desarrollo y aprendizaje de
nuevos lenguajes.
I. INTRODUCCIÓN
A nueva tendencia de uso de dispositivos móviles exige
que los desarrolladores y empresas se adapten a esta y
empiecen a crear aplicaciones para complementar o suplantar a
las aplicaciones desarrolladas en la web y abarcar una mayor
cantidad de usuarios.
Pero crear estas aplicaciones adicionales a los sitios/sistemas
web para los diferentes sistemas operativos móviles conlleva a
incrementar los costos del desarrollo al tener que reescribir el
código para cada plataforma. Para ello existen frameworks*
que son capaces de transformar un sitio web (altamente
recomendado Adaptable**) en una aplicación móvil para
cualquier sistema operativo con ciertas limitaciones del uso del
hardware (dependiendo del framework*) como pueden ser: uso
del giroscopio, GPS, uso de cámaras, etc.
TABLA I
ENVÍOS DE DISPOSITIVOS POR SEGMENTOS A NIVEL MUNDIAL (CIENTOS DE
UNIDADES)
Device Type 2013 2014 2015
Traditonal PCs
(Desk-Based and Notebook)
296,131 276,221 261,657
* Conjunto de herramientas que contienen rutinas y clases predefinidas para
ahorrar el tiempo de desarrollo.
** Es una filosofía de diseño y desarrollo cuyo objetivo es adaptar la
apariencia de las páginas web al dispositivo que se esté utilizando para visualizarla [1].
Ultramobiles, Premium
21,517 32,251 55,032
PC Market
Total 317,648 308,472 316,689
Tablets 206,807 256,308 320,964
Mobile Phones 1,806,964 1,862,766 1,946,456
Other Ultramobiles
(Hybrid and
Clamshell)
2,981 5,381 7,645
Total 2,334,400 2,432,927 2,591,753
FUENTE: GARTNER(JUNIO 2014) [2]
Como podemos observar en la Tabla 1, el envío a
distribuidores y clientes de dispositivos tradicionales como
PC’s de escritorio y Laptops prevee una disminución en el
2015 mientras que el de dispositivos móviles crece, lo que
confirma la tendencia del uso de móviles.
II. DESARROLLO DE SITIOS WEB ADAPTABLES
El primer paso para crear una aplicación móvil híbrida es el
desarrollo de un sitio web Adaptable para lograr que el diseño
y tamaños de los componentes se adapten a la resolución de la
pantalla del dispositivo en el que correrá.
A. HTML5
HTML es un lenguaje de etiquetas con el que se generan
páginas web. Actualmente se encuentra en su quinta revisión.
Es importante recalcar que se debe de usar esta versión
debido a las nuevas etiquetas y soportes de elementos
embebidos como audio y video sin necesidad de plugins
adicionales como flash.
B. CSS3
Las hojas de estilo en cascada se usan para definir la
presentación del documento HTML que previamente hemos
Desarrollo rápido de Aplicaciones Móviles
Híbridas con HTML5, JavaScript y CSS Carlos Rodolfo Soriano López
Universidad Don Bosco de El Salvador
L
2
desarrollado a través de reglas aplicadas a sus etiquetas y
lograr separar la estructura de la presentación.
C. JavaScript
Es un lenguaje de programación que se ejecuta del lado del
cliente mejorando la interfaz de usuario y hacer el sitio web
dinámico al agregarle interactividad con el usuario sin enviar
peticiones al servidor.
III. CONVERSIÓN DEL SITIO WEB EN APLICACIÓN MÓVIL
Ahora que ya tenemos un “sitio web Adaptable”
procederemos a convertirlo en una Aplicación empaquetada
para la plataforma móvil que tenemos como objetivo (Android,
iOS, Blackberry, etc.) usando Frameworks que ya incluyen las
API’s del sistema destino para hacer lo más cercana a una
Aplicación nativa. Las instrucciones y formas de compilar
varían entre uno y otro framework, pero todos tienen el mismo
propósito.
TABLA II
FRAMEWORKS PARA CREAR APLICACIONES HÍBRIDAS MÁS POPULARES
Nombre URL
Ionic http://ionicframework.com/
PhoneGap http://phonegap.com/
Kendo UI Mobile http://www.telerik.com/kendo-ui
App Acelerator Titanium http://www.appcelerator.com/
Rhodes http://rhomobile.com/products/rhodes/
IV. LIMITACIONES DE LA APLICACIÓN MÓVIL
Dependiendo del Framework que se use para convertir
nuestro desarrollo web en Aplicación Móvil se puede encontrar
con limitantes del uso del hardware y sistema de ficheros del
dispositivo ya que nuestra APP es un sitio web embebido en la
Aplicación Móvil; aunque varios ya cuentan con las API’s
necesarias para poder acceder a estos recursos.
V. CONCLUSIONES
Sin duda las aplicaciones Híbridas por el momento no
pueden compararse con el desempeño que puede tener una
nativa en cuanto al uso de los periféricos del teléfono; pero es
la mejor opción para desarrollar aplicaciones informativas o
donde la interacción con el usuario depende únicamente de
entradas de datos de su parte y la manipulación y salida del
resultado del lado de la Aplicación Móvil. Y su tiempo de
desarrollo es relativamente bajo respecto a las aplicaciones
nativas y no dependen de aprender un nuevo lenguaje de
programación o a utilizar las API´s del sistema, agregando
también que se escribe un solo código en HTML5 para la APP
y el framework se encarga de crear el paquete para los
diferentes sistemas operativos móviles que soporte.
REFERENCIAS
[1] Diseño web adaptable. (2014, 26 de diciembre). Wikipedia, La
enciclopedia libre. Fecha de consulta: 06:55, enero 10, 2015 desde
http://es.wikipedia.org/w/index.php?title=Dise%C3%B1o_web_adaptabl
e&oldid=79003139. [2] Worldwide Device Shipments by Segment. Gartner. Fecha de consulta:
06:55, enero 10, 2015 desde
http://www.gartner.com/newsroom/id/2791017