Crear un proyecto en Ionic es muy sencillo, solo debemos asegurarnos de que lo hayamos instalado correctamente.
Si tienes dudas acerca de la instalación te invíto a ver el Post Anterior.
Debemos de asegurarnos tener la version mas reciente del CLI de Ionic, esto lo verificamos con el comando:
ionic -v
Esto nos permite saber que versión del CLI estamos usando.
Creando el Proyecto
Para poder crear un nuevo proyecto debemos de tener en cuenta en donde lo queremos almacenar, para esto es muy importante movernos dentro de nuestra terminal o CMD, usaremos comandos comandos básicos así que no te preocupes, te dejo algunos comandos que debes de tener en cuenta.
Comandos | Descripción | Sistema Operativo |
---|---|---|
ls | Listar Elementos | MacOS / Distros GNU/Linux |
dir | Listar Elementos | Windows |
cd | Cambio de Directorios | Todos |
clear | Limpiar Terminal | MacOS / Distros GNU/Linux |
cls | Limpiar Terminal | Windows |
pwd | Ruta Absoluta Actual | MacOS / Distros GNU/Linux |
chdir | Ruta Absoluta Actual | Windows |
Una vez hayamos pensado en donde queremos almacenar nuestro proyecto, debemos de saber donde nos encontramos dentro de nuestra terminal, regularmente siempre nos ubica en nuestra carpeta personal o la del usuario que inició sesión, si queremos asegurarnos en donde nos encontramos debemos de usar el comando pwd o en su defecto chdir dependiendo el sistema operativo en donde nos encontremos, si después de presionar enter nos muestra algunas carpetas conocidas como Escritorio o Desktop o Documentos o Descargas entonces nos encontramos en nuestra carpera personal, y ahí quedará de nosotros elegir en donde queremos almacenar el proyecto.
Para este ejemplo elegiré crear mi proyecto en el Escritorio, para esto debo de usar el comando para cambiar de directorio "cd" seguido del nombre de la carpeta a donde nos dirigimos "Escritorio" quedaría así:
cd Escritorio
NOTA: debemos de cuidar que el nombre de la carpeta esté bien escrita, respetando mayúsculas, o de igual manera podemos apoyarnos del Tabulador para autocompletar lo que estemos escribiendo.
Muy bien ya nos encotramos en la carpeta, es momento de crear el proyecto, para esto usaremos el comando:
ionic start
Si usamos únicamente este comando el CLI nos brindará los pasos que debemos de seguir, como ingresar el nombre de nuestro proyecto, si queremos usar un template al momento de iniciar nuestro proyecto, y también el Framework que deseaos usar con Ionic.
Si ya tenemos en mente el nombre de nuestro proyecto podemos hacer la ejecución en una sola línea simplemente agregando otros parametros como lo indico a continuación:
ionic start nombredelProyecto tabs
Con esto le indicamos al CLI de Ionic que vamos a crear un proyecto con el nombre "nombredelProyecto" y agregará el template de "tabs".
Los Templates disponibles son:
Templates | Descripción |
---|---|
blank | Crea un Proyecto sin Template. |
tabs | Crea un proyecto con tres vistas donde puedes navegar entre ellas muy fácil. |
sidemenu | Crea un proyecto con un menú lateral |
Posterior a esto nos pedirá elegir el Framework que deseamos usar, en este caso podemos elegir entre Angular o React, si queremos saltarnos este paso y ejecutar todo desde una sola linea a nuestro comando anterior le debemos de agregar una bandera "--type=NombredelFramework" junto al nombre del Framework.
ionic start nombredelProyecto tabs --type=angular
Algunas veces nos aparecerá un mensaje que nos indicará que hay una actualización disponible para nuestro CLI, podemos actualizarla, esto corregirá ciertos bugs o detalles que tenga el CLI, la actualización siempre incluye una bandera "-g", eso significa que debemos de ejecutar los comandos como super usuario.
Ejecución del proyecto
Para poder ejecutar el proyecto debemos de dirigirnos a la carpeta del proyecto que acabamos de generar, esto lo hacemos con el comando de cambio de directorio:
cd nombredelProyecto
Una vez dentro del proyecto podemos lanzar el servidor, esto lo hacemos con el comando serve del CLI de Ionic:
ionic serve
Esperamos a que lance el proyecto al navegador, el puerto por default es el 8100 y con esto ya tendríamos todo para comenzar a codear.
si quieres bajar o cerrar el servidor local lo puedes hacer con el comando:
ctrl + c
**Si presentas el Error:EACCES at npm install with sudo:
La solucón mas efectiva es Re-instalar el NodeJS
Aumenta tu productividad con GitHub Copilot
- done Curso GRATUITO
- done Regístrate antes del 31 de Marzo
- done Obtén una ventaja competitiva
- done Aprovecha la IA a tu favor