You are on page 1of 16

DESARROLLO DE

APLICACIONES

PORQU USO IONIC?


Desarrollo de apps utilizando tecnologas web
No necesitas aprender lenguaje nativo
Basado en Javascript y Angular
Gran libreria de plugins propios: NG - Cordova
Gran rendimiento en el dispositivo comparado a otros frameworks
Cdigo reutilizable
Interfaz grafica muy cuidada

LA BASE DE IONIC

A N G U L A R . J S Y C O R D O VA

Angular: Lgica de la aplicacin.


Cordova: Comunicacin con el dispositivo

Aplicaciones con Ionic


HTTP://SHOWCASE.IONICFRAMEWORK.COM/

Nada que envidiar a apps nativas

R E Q U I S I T O S PA R A D E S A R R O L L A R
Node.JS
Paquetes Cordova y Ionic
SDK de Android / Xcode
Java JDK (Android)
Apache-ant
Ios-sim (Mac OS)

I N S TA L A C I N D E N O D E . J S

Descargar para tu sistema: www.nodejs.org


Instalar
Verificacin: node -v

I N S TA L A C I N C O R D O V A & I O N I C

PERMISOS

GLOBAL

PA Q U E T E S

sudo npm install -g cordova ionic

XCODE / SDK ANDROID


Xcode: Appstore

Android Studio: http://developer.android.com/sdk/

index.html

J AVA J D K
Android nativo esta basado en Java. Ionic funciona

sobre cordova, y cordova necesita comunicarse con la


parte nativa y compilar una app.

http://www.oracle.com/technetwork/java/javase/
downloads/jdk8-downloads-2133151.html

C O N F I G U R A N D O A N D R O I D E N E L PAT H
En nuestro PATH, aadimos la ruta a platform-tools y tools.
MACOS (.bash_profile o .zshrc).
export PATH=${PATH}:/Users/ivanbtrujillo/Library/Android/

sdk/platform-tools:/Users/ivanbtrujillo/Library/Android/
sdk/tools
Windows: Propiedades del sistema > Configuracin

avanzada > Variables de entorno


Porqu instalar Android Studio y no SDK nicamente?

A PA C H E A N T
Herramienta de apache que realiza tareas
repetitivas en el momento de compilar
OSX: brew install ant
Windows: Descargar , descomprimir y aadir al PATH

http://ant.apache.org

IOS-SIM (MAC OS)


Utilidad desarrollada por Phonegap para lanzar
una aplicacin IOS en el emulador IOS desde la
linea de comandos.
Debemos instalar ios-sim via npm para poder lanzar la

app de cordova a un emulador de IOS en mac OS.

sudo npm install -g ios-sim

FA L L O A L E M U L A R E N Y O S E M I T E
En OS X Yosemite se ha detectado un problema que impide

iniciar el emulador desde cordova de forma normal, utilizando


ionic emularte ios. Para corregirlo hay que hacer lo siguiente:

Instalar brew
Instalar reattach-to-user-namespace va brew
Ejecutar nuestra aplicacin en el emulador de IOS de esta forma:

reattach-to-user-namespace ios-sim launch ./platforms/ios/build/


emulator/miaplicacion.app

PA S O S PA R A G E N E R A R L A A P P
Crear un proyecto:

sudo ionic start miaplicacion blank

Aadir una plataforma:

sudo ionic platform add ( ios / android)

Compilar la aplicacin para la plataforma indicada

sudo ionic build ( ios / android )

Emular la aplicacin

sudo ionic emulate ( ios / android )

En OS X Yosemite, ejecutarlo as: reattach-to-user-namespace ios-sim launch ./platforms/


ios/build/emulator/miaplicacion.app

Ejecutar la app en un dispositivo USB

sudo ionic run ( ios / android )

Ejecutar la app en el navegador (no funcionan los plugins)

sudo ionic serve

PA R A T E R M I N A R

Proximamente:
Estructura del proyecto
Componentes de Ionic
Plugins va NG-Cordova
Creando nuestro primer proyecto

Consejos
H T M L , C S S , J AVA S C R I P T Y A N G U L A R . J S
N O A B U S E S D E L C O P Y PA S T E
VE CON CALMA Y APRENDE BIEN

Gracias

@ivanbtrujillo

You might also like