Ionic 2 – potente framework con el que podremos crear aplicaciones híbridas

PorErik Guerrero V.

Ionic 2 – potente framework con el que podremos crear aplicaciones híbridas

¿Qué es Ionic 2?

Ionic 2 es un potente framework con el que podremos crear una app híbridas que se comportan como nativas. Es gratis, open source (Licencia MIT) y nos ofrece una librería de componentes y herramientas HTML, CSS, JS que harán nuestra vida más fácil al desarrollar apps para Android e iOS.

Ionic 2 está desarrollado utilizando SASS y optimizado para Angular.js siendo estos los principales beneficios que obtendremos de su uso:

Rendimiento
La velocidad es tan importante, sólo se nota cuando no está allí. Iónic está construido para llevar a cabo y se comporta muy bien en los últimos dispositivos móviles con mejores prácticas como las transiciones eficientes acelerados por hardware, y los gestos táctiles optimizados.

Diseñado
Limpia, simple y funcional. Iónica está diseñado para trabajar y mostrar muy bien en todos los dispositivos y plataformas móviles actuales. Con componentes prefabricados, tipografía, y una (todavía extensible) del tema básico precioso que se adapta a cada plataforma, podrás construir en estilo.

Nativo y web optimizado
Iónic emula directrices de interfaz de usuario de aplicaciones nativas y utiliza SDK nativo, con lo que las normas de interfaz de usuario y las características del dispositivo de aplicaciones nativas, junto con toda la potencia y la flexibilidad de la web abierta. Iónic utiliza Cordova o Phonegap para desplegar de forma nativa, o se ejecuta en el navegador como una aplicación web progresiva.

Instalación

Linux – Ubuntu
Dependencias
$ sudo apt-get install python-software-properties python g++ make
$ sudo add-apt-repository ppa:chris-lea/node.js
$ sudo apt-get update
$ sudo apt-get install nodejs
$ sudo npm install -g cordova

Windows
1.- Descargar e instalar nodejs desde:
http://nodejs.org/
Ionic

$ sudo npm install -g ionic

Verificamos la versión instalada

$ sudo ionic –v
2.0.0-beta.31

Nuestra primera app

Ahora que lo tenemos todo listo empieza lo divertido. Para crear nuestra primera app nos movemos a nuestro directorio habitual de desarrollo desde el terminal, y escribimos los siguiente:

$ ionic start miprimeraapp blank
Esto nos creará el esqueleto de nuestra primera app para que empecemos a desarrollar. Sin embargo, si estáis empezando, os recomiendo que creeis una nueva app utilizando las plantillas “starter” que proporciona Ionic. Para ello escribiremos:

$ ionic start miprimeraapp tabs
Ahora añadiremos las plataformas en las que queremos desplegar nuestra app. Solo podremos añadir iOS si estamos en MacOS.

$ ionic platform add android
$ ionic platform add ios

Todo esto habrá creado un directorio miprimeraapp dentro de nuestro directorio de desarrollo. Si navegamos en él, veremos la siguiente estructura:

├── bower.json // bower dependencies
├── config.xml // cordova configuration
├── gulpfile.js // gulp tasks
├── hooks // custom cordova hooks to execute on specific commands
├── ionic.project // ionic configuration
├── package.json // node dependencies
├── plugins // where your cordova/ionic plugins will be installed
├── platforms // iOS/Android specific builds will reside here
├── scss // scss code, which will output to www/css/
└── www // application – JS code and libs, CSS,

Si quieres ver una demo del resultado que obtendréis, aquí os dejo un enlace a un Plunker en el que podréis verla funcionando.

Si quieres verla funcionando en vuestro equipo solo tendrás que escribir los siguiente:

$ ionic serve
Esto os abrirá la app en el navegador (o escribiendo en el browser del navegador http://localhost:8100/ )desde el que podrás probarla. Otra alternativa es este comando:

$ ionic serve –-lab

Leer también:
https://ionicframework.com/getting-started/https://ionicframework.com/developers/

Facebook Comments

About the author

Erik Guerrero V. administrator

Mas de 10 años de experiencia como analista programador, tanto backend como frontend, muchos proyectos tanto intranet, extranets, redes sociales, publicitarios, comercio electrónicos, ERP, CRM, BI, SIst. de Gestion, Email Marketing, Sist. Financieros, Contables, también me desempeño como freelance en mis tiempos libres, como también me dedico a la investigación en cuanto a nuevas tecnologías.