Framework para crear aplicaciones híbridas HTML5 para smartphones y dispositivos móviles
Ionic es un framework de código abierto optimizado para crear aplicaciones para teléfonos móviles. La principal característica de esta herramienta, es que permite crear aplicaciones híbridas en HTML, Javascript y CSS.
La plataforma está construida sobre otro popular framework de Javascript, Angular JS. Por lo que es recomendable conocerlo antes de aventurarnos a programar con ella.
Ionic está pensada para usar las API's nativas de Apache Cordova, que son un conjunto de herramientas que nos dan acceso directo al uso del hardware del teléfono como la cámara, el gps o el acelerómetro utilizando Javascript.
Antes de instalar Ionic, deberemos instalar NodeJS, para poder descargar paquetes y dependencias de Ionic.
Una vez instalado abrimos una linea de comandos y ejecutamos:
Ahora instalaremos Cordova:
Ionic soporta un conjunto de comandos para manejar la aplicación de forma sencilla. Para crear una aplicación usaremos:
En este caso el nombre de nuestra app es miaplicacion y blank es el nombre de la plantilla que usaremos. Si accedemos a la carpeta miaplicacion, veremos la estructura de archivos y directorios de nuestra APP.
Si nos fijamos, hay una carpeta llamada www, que es donde se guardan los archivos HTML, CSS, y Javascript por defecto que usará nuestra aplicación.
Para testear nuestra aplicación de la forma más sencilla, es probarla en nuestro navegador. Para ello, desde la linea de comandos, nos situaremos en la carpeta miaplicacion y ejecutamos la instrucción:
Se abrirá el navegador apuntando a la url http://localhost:8100 con nuestra aplicación. Podemos redimensionar manualmente la pantalla del navegador para ver como se adapta el diseño responsive.
Para probar la aplicación en un emulador, primero debemos descargarlo. Para usar un emulador android podemos ejecutar el comando:
Una vez instalado, compilamos el código de nuestra APP para dejarlo preparado para el emulador:
Y finalmente ejecutamos el emulador:
Se abrirá una aplicación que que simula un teléfono móvil y automáticamente veremos nuestra APP en la aplicación.
Para más información sobre otros emuladores como el IOS de apple, puedes visitar la página https://ionicframework.com/docs/intro/cli.
Finalmente, para ejecutar la aplicación en el dispositivo podemos ejecutar:
Este comando compilará y ejecutará la aplicación. Si tenemos el dispositivo conectado al PC, y configurado para permitirlo, veremos como se instala la aplicación APK en el móvil.