¿Han pensado alguna vez en desarrollar una App? Puede sonar aterrador aprender tecnologías de plataformas específicas para hacerlo y tal vez no tengas el tiempo para hacerlo. La buena noticia es que existe Ionic. Este framework de desarrollo móvil HTML5 orientado a la creación de aplicaciones móviles híbridas te permitirá lograrlo rápidamente. Conoce cómo.
Como los sitios en Internet, las aplicaciones híbridas son construidas con tecnologías web como HTML, CSS, Y JavaScript. Su diferencia radica en estas son guardadas en una aplicación nativa que usa un WebView de la plataforma móvil.
Este WebView puede describirse como un navegador sin ventana, configurado para ejecutarse en pantalla completa. Esto permite acceder a funciones del dispositivo, que a menudo son restringidas para los navegadores móviles comunes, como la cámara, los contactos, sensores y demás.
Por otro lado, las Apps híbridas incluyen elementos nativos de UI en situaciones particulares. Además, presentamos algunas ventajas sobre las nativas, en términos de soporte entre plataformas, tiempos de desarrollo y acceso a código externo.
Podemos ver a Ionic como el framework front-end y de interfaz de usuario (como Bootstrap) encargado de toda la apariencia y las interacciones que el usuario ejecuta, mediante componentes nativos predefinidos y animaciones optimizadas.
Tenga en cuenta que las aplicaciones híbridas necesitan Apache Cordova , una plataforma que brinda un conjunto de funciones JavaScript para acceder a funciones del dispositivo a través de complementos construidos con código nativo.
Debido a que Ionic es un framework HTML5 necesita un contenedor como Cordova para ejecutarse como una aplicación nativa.
En ese sentido, las herramientas propias de Ionic usan Cordova para su funcionamiento interno.
Los recursos de la aplicación como el código HTML, CSS y JavaScript son contenidos a través de las herramientas que pone Apache Cordova a nuestra disposición para SDK de plataformas específicas.
Estas herramientas de Apache Cordova son usadas a través de una interfaz de línea de comandos (CLI).
Por otro lado, las apps híbridas ofrecen un camino para que los desarrolladores web puedan usar sus habilidades y no quedar atascados en plataformas privadas, lo que incluye los lenguajes de programación y los SDK proporcionados por los proveedores de cada plataforma.
Ionic usa AngularJS para gran parte de su funcionalidad central. Podemos usar solo la porción CSS de Ionic (también nos da la opción de usar Sass ), pero podemos sacarle el máximo provecho al framework en términos de desarrollo y rendimiento usando Angular.
Cabe mencionar que Apache Cordova comenzó como un proyecto llamado PhoneGap. Actualmente PhoneGap existe como una distribución de Apache Cordova e incluye herramientas adicionales.
npm install -g cordova iónico
actualización npm -g cordova iónico
Posteriormente, vamos a necesitar instalar SDK específico de cada plataforma para poder lanzar nuestra aplicación en ellas, pero este tema no será incluido en esta entrada.
Recuerde que puede encontrar más información en la documentación de Ionic en cualquier momento.
Una interfaz de línea de comandos se usa desde una consola (comúnmente conocida como Terminal). Recibe entrada de esta consola y muestra los resultados en la misma.
La interfaz de línea de comandos de Ionic nos permite de forma fácil iniciar, construir, ejecutar y emular apps hechas con el framework.
Podemos iniciar una aplicación usando una de las plantillas predefinidas de Ionic, o una aplicación vacía.
myApp de inicio iónico en blanco pestañas myApp de inicio iónico Menú lateral de myApp de inicio iónico
Estos comandos crearán una carpeta llamada myApp y configurarán los archivos, más carpetas requeridas. Para acceder a la carpeta uso principal:
cd myApp
Para ejecutar apps de Ionic en cualquier plataforma desde el CLI solo necesitamos estos comandos (y tener el teléfono o la Tablet conectado al PC, por supuesto). En plataforma puede ir android o ios:
plataforma iónica agregar plataforma
plataforma de construcción iónica
plataforma de carrera iónica
También, podemos probar la aplicación directamente en el navegador de nuestra PC. Esto nos conviene cuando no hemos agregado aún alguna plataforma o no hemos instalado los SDK requeridos. Sin embargo, esto podría limitar el desarrollo más avanzado en algún punto, debido a la falta de acceso completo a las funciones nativas móviles. De hecho, algunos complementos de Cordova podrían no funcionar correctamente.
Este comando inicia un servidor web básico con actualización en vivo y otras tareas automatizadas, gracias a Gulp.
servicio iónico
Cuando iniciamos la aplicación desde el CLI, Ionic generará todos los archivos y carpetas necesarios para el proyecto. Cada carpeta y archivo tiene un propósito.
Son scripts ejecutados durante el proceso de construcción de la app. Son usados para cambiar la funcionalidad de los comandos de Cordova y para crear procesos automatizados.
Esta es la carpeta donde se crean los proyectos de Android e iOS.
No es recomendable editar ningún archivo de este directorio; esto es porque se genera automaticamente al ejecutar:
ionic add
yionic build
Esta carpeta contiene los plugins de Cordova. Al iniciar una aplicación Ionic, algunos complementos imprescindibles son instalados por defecto.
Esta carpeta se usa para agregar recursos como íconos y pantallas splash al proyecto. Se genera en la consola:
ionic resources
.
Ya que los estilos incluidos Ionic core se construyen con Sass, en este directorio se almacena un archivo Sass que podemos modificar.
Esta es la carpeta principal para desarrolladores de Ionic. Aquí estaremos la mayor parte del tiempo. Ionic nos da su estructura de archivos por defecto dentro de ‘www’ pero siempre podemos acoplarla a nuestras necesidades. Al abrir esta carpeta encontraremos:
El desarrollo de aplicaciones móviles híbridas puede ser atractivo para los intereses de una organización. ¿Por qué contratar un desarrollador para cada plataforma cuando se puede contratar un único desarrollador y apuntar a todas a través de HTML, CSS y JavaScript?, pero la verdad es que puede ser más complejo que eso.
Las aplicaciones híbridas permiten abarcar más de una plataforma. Sin embargo, cada una de ellas viene con un conjunto de peculiaridades únicas que tienen que ver con su ejecución web o WebView. Esto se enfatiza en el caso de Android, cuál puede ser inconsistente entre las versiones del sistema operativo.
Las pruebas pueden ser complejas debido a que el navegador no nos puede dar toda la información sobre el entorno del teléfono.
Hay muchos tipos de plataformas y dispositivos por lo que generalmente tenemos que cubrirlos todos. Es difícil combinar las múltiples funcionalidades nativas, y muchas veces nos encontraremos con problemas de compatibilidad entre complementos, lo que lleva a errores en la construcción de la aplicación difícil de encontrar.
Por último, las aplicaciones híbridas tienden a ser un poco más lentas que las nativas, pero esta área avanza muy rápido y esto no será problema en un futuro. Por lo tanto, las aplicaciones híbridas son una opción muy viable para el desarrollo de aplicaciones que no requieren funciones nativas demasiado fuertes. Es un camino que vale la pena mirar mas a fondo.