4.11.2017

Creando un app con Ionic y VS Code–configurando el ambiente

Visual Studio Code es un IDE muy versátil que nos permite desarrollar utilizando muchas tecnologías, y en este caso lo vamos a utilizar para desarrollar un app móvil utilizando Ionic Framework. Ionic es un Framework que permite utilizar los conceptos del desarrollo web para crear aplicaciones para iOS, Android, Windows, etc.  En esta serie de post vamos a aprender como desarrollar estas aplicaciones usando Ionic + VS Code.

Instalando el ambiente

Para iniciar tenemos que instalar node.js en nuestra máquina ya que Ionic necesita de esta librería para poder funcionar. Para llevarlo vamos a la pagina de node.js y descargamos e instalamos la versión de node.js para nuestro sistema operativo, en mi caso, Windows de 64 bits.

image

Utilizamos LTS porque es la versión que es normalmente soportada por Ionic.

Ahora ya podemos utilizar el IDE VS Code para continuar con los siguientes pasos. Primeramente abrimos el terminal integrado de VS Code y procedemos a instalar Ionic utilizando el siguiente comando – utilizando npm de node.js

image

Ahora desde el mismo terminal procedemos a crear una aplicación utilizando el comando ionic start nombredelapp –-version de ionic.

image

Este comando nos crea un aplicativo llamado AccountMe en el folder donde estamos posicionados con una plantilla de “tabs” pre diseñada y lista para funcionar. Si abrimos este folder en VS Code podemos ver a estructura del proyecto generada.

image

El siguiente paso es probar nuestro aplicativo recién generado para comprobar que todo esta listo para iniciar el desarrollo utilizando el Ionic Serve Lab desde donde podemos ver nuestro aplicativo en una página Web y probarlo. El comando para lanzar el app es el siguiente:

image

Si todo salió correctamente veremos el aplicativo web funcionando con las plataformas seleccionadas en el combo de plataformas tal y como se ve en la siguiente figura.

image