Hoy he empezado a probar Ionic, un framework para la implementación de aplicaciones móviles híbridas. Las aplicaciones híbridas aún están en un punto complicado, al estar implementadas en HTML5 y JS  hace que muchos móviles aún no las puedan mover con suficiente fluidez. Aún así, resulta muy interesante la posibilidad de implementar un única app que funcione en todos los sistemas operativos móviles. Su principal argumento es que se espera que pase lo mismo que con HTML5 y el PC: que en los próximos años los móviles aumenten su potencia y su autonomía y puedan mover las apps sin problemas. En esta entrada, resumiré el proceso de configuración y como resolver algunos problemas sencillos que me he encontrado durante la instalación.

Ionic está implementado sobre AngularJS y utiliza Cordova para generar las aplicaciones. Las apps se implementan como aplicaciones Angular ampliadas con directivas, servicios y el look and feel proporcionado por Ionic. Por ello, será necesario tener unos conocimientos mínimos del framework de Google.

1. Instalación de Cordova

La instalación de Cordova la realizaremos utilizando el gestor de paquetes de NodeJS npm:

sudo npm install -g cordova

Nota: la opción -g instala Cordova a nivel global en todo tu ordenador.

Los problemas aparecen cuando no tenemos los entornos de desarrollo configurados de la forma que espera Cordova, en ese caso la instalación nos lo hará saber con un mensaje de error.

Configuración Android

Al habilitar Cordova para Android encontré un par de errores, el primero fue:

WARNING: Your system does not meet requirements to create android projects. See error output below.
The command `android` failed. Make sure you have the latest Android SDK installed, and the `android` command (inside the tools/ folder) added to your path. Output: /bin/sh: android: command not found

SKIPPING android bootstrap.

Que resolví siguiendo la guía oficial de Cordova para habilitar Android. Resuelto el primer problema, llegó el segundo: es necesario tener instalada como mínimo la versión 4.2 del SDK de Android:

WARNING: Your system does not meet requirements to create android projects. See error output below.
Please install Android target 17 (the Android 4.2 SDK). Make sure you have the latest Android tools installed as well. Run `android` from your command-line to install/update any missing SDKs or tools.

Una actualización con Android SDK Manager:

android update sdk

y todo listo

SUCCESS: android ready to rock!

Configuración iOS

En lo que respecta a iOS me encontré con el siguiente problema:

WARNING: Your system does not meet requirements to create ios projects. See error output below.
Xcode is (probably) not installed, specifically the command `xcodebuild` is unavailable or erroring out. Output of `xcodebuild -version` is: Error: No developer directory found at /Developer. Run /usr/bin/xcode-select to update the developer directory path.

SKIPPING ios bootstrap.

Una búsqueda rápida del error y encontré una solución lanzando este comando:

sudo xcode-select -switch /Applications/Xcode.app/Contents/Developer

Si todo ha ido bien veremos este mensaje:

SUCCESS: ios ready to rock!

2. Instalar Ionic

sudo npm install -g ionic

Si os aparecen errores de instalación del estilo:

npm ERR! Error: No compatible version found: colors@’^0.6.2′

Probad a actualizar node y limpiar caché:

npm cache clear
sudo npm update -g
npm install -g npm

3. Empezar un proyecto

Creamos el proyecto con la herramienta de linea de comandos de Ionic:

ionic start todo blank

Habilitamos las plataformas para las que desarrollaremos:

$ ionic platform ios
$ ionic platform android

Y ya estamos listos para empezar a probar!