Introducción

Que es APACHE CORDOVA?

Apache Cordova es un marco de desarrollo móvil de código abierto. Permite utilizar las tecnologías
web estándar como HTML5, CSS3 y JavaScript para el desarrollo multiplataforma, evitando el
lenguaje de desarrollo nativo para cada plataforma móvil. Las aplicaciones se ejecutan dentro de
un empaquetado para cada plataforma y dependen de enlaces estándares a APIs para acceder a
los elementos de cada dispositivo como sensores, datos y estado de la red.

Que es IONIC?
Ionic es un nuevo framework para crear aplicaciones web móviles basadas en HTML. Utiliza como
base Cordova, lo que significa que en su núcleo es una aplicación PhoneGap que puedes compilar
usando Phonegap build o Cordova.

Requisitos
1. NodeJS
2. JDK
3. SDK Manager
Descargar node.js
Lo primero que vamos a realizar es la instalación del nodeJS que nos permitirá realizar la
instalación de los paquetes de cordova y ionic, y también realizar la ejecución de los comandos de
compilación.

Se puede descargar de la siguiente página: https://nodejs.org/es/about/ y debe descargar el

paquete dependiendo de tu sistema operativo.

Verificar si tiene instalado el jdk

Abra una ventana de comando mediante “cmd”, ejecute el comado “java -version”.

SI no está instalado el JDK debe descargarse e instalarse de la siguiente página.

http://www.oracle.com/technetwork/es/java/javase/downloads/index.html

Descargar SDK Manager

SDK responde a las siglas Software Development Kit, lo que viene a ser un kit de desarrollo de
software. Con él podremos desarrollar aplicaciones y ejecutar un emulador del sistema Android de
la versión que sea. Todas las aplicaciones Android se desarrollan en lenguaje Java con este kit.

Descargue el sdk manager de la siguiente página: (NO vamos a instalar todo el Android Studio)

http://android-sdk.uptodown.com/windows/descargar

Vamos a instalar el SDK Manager

Una vez instalado el SDK Manager, debemos abrirlo para descargar los paquetes de Android SDK
tools, Android SDK Platform Tools, SDK platform (API 25), así como los complementos necesarios
para la ejecución y compilación de las apps.
 Aceptar licencia
e instalar

Posibles errores
Si la instalación de las herramientas presentan algún problema es muy posible que sea por
permisos de carpetas. Para esto debemos dar permisos a las carpetas platforms y temp donde esta
instalado el sdk

Dar permisos a carpeta platforms, temp y tools

Al instalar el sdk android 7.1.1 (api 25), puede presentarse el siguiente error

En este caso se debe cerrar el sdk manager, y abrir la carpeta ANDROID_HOME/temp y buscar el
archivo tools_r25.2.5-windows.zip, y descomprimirlo en ANDROID_HOME/tools

Instalar gradle
https://gradle.org/install/
descargar el grade binary en el enlace

Extraer el archivo comprimido en la ruta C:\Gradle

Configuración de variables de entorno
Después de instalar las herramientas del SDK;

Para que el framework cordova use correctamente el sdk de Android para construir las
aplicaciones es necesario configurar las variables de entorno en el computador.

Debemos configurar la variable PATH para que pueda encontrar las herramientas del SDK, y
también la variable ANDROID_HOME.

De clic derecho en “este equipo” y seleccione la opción “Propiedades”.

 Selecciona la variable PATH
y presiona editar para
agregar las rutas del SDK

Agregar las siguientes rutas donde quedaron instaladas las herramientas del SDK, el JDK, y el
Gradle.(separadas por punto y coma)

C:\Program Files (x86)\Android\android-sdk\tools;

C:\Program Files (x86)\Android\android-sdk\platform-tools;
C:\Program Files\Java\jdk1.8.0_101\bin
C:\Gradle\gradle-4.0.1\bin
VARIABLES DEL SISTEMA
Ahora agregamos las variables del sistema. ANDROID_HOME, ANDROID_SWT, JAVA_HOME, y
GRADLE_HOME

Agregar nuevas
variables

Nota: reiniciar el equipo para que tome efecto las variables

Instalación CORDOVA e IONIC
Para hacer la instalación de los framework CORDOVA e IONIC debemos abrir una ventana de
comandos de nodeJS.

En línea de comando ejecutar:

npm install -g cordova ionic

Después de descargados e instalados los framework podemos empezar por construir nuestra
primera aplicación. (debes ubicarte en la carpeta en donde deseas crear la aplicación), ejemplo es
el nombre del proyecto que voy a crear uds usen el nombre que deseen.

ionic start ionicholamundo sidemenu

Ionic tiene tres plantillas con las cuales podemos iniciar nuestros proyectos:

blank: Plantilla en blanco; tabs: plantilla con pestañas; sidemenu: plantilla con menú lateral)
Despues de crear el proyecto nos pregunta si deseamos crear una cuenta de ionic, le decimos que
no.

Una vez creado el proyecto podemos ver las capetas y archivos que el proyecto ionic ha creado.

Igual que en los proyectos creados con angular cli, tenemos una estructura similar abrimos la
carpeta src/app en donde estará el componente principal de nuestra aplicación, aunque en la
estructura, ionic también crea la carpeta pages, en donde estarán los demás componentes y serán
los que debemos modificar o manipular con nuestra aplicación.

Podemos ver nuestra aplicación si ejecutamos el comando

ionic serve

Plataforma Android
Después de crear el proyecto debemos ingresar a la carpeta que creó para nuestro caso el crea la
carpeta “ionicholamundo”; (ejecutar comando cd ionicholamundo)
Dentro de la carpeta del proyecto ejecutamos el siguiente comando para agregar la plataforma en
la cual deseamos crear la aplicación. (android, ios)

ionic cordova platform add android

Despues de ejecutar el comando vemos que se agregó una carpeta platforms en donde se instala y
se compila la aplicación Android.

Una vez agregada la plataforma en la que deseamos construir nuestra app ejecutamos el comando
build para construir nuestra app.

ionic cordova build android

Despues de compilada nuestra aplicación la podemos buscar en la carpeta output/apk