Crear una Aplicación

Clase 9 de 36 • Curso Básico de Ionic 2018

Clase anteriorSiguiente clase

Juan C Felizzola

student•

Para crear una app de ionic:

En blanco:
ionic start [nombreApp] blank
Con tabs:
ionic start [nombreApp] tabs
Con sidemenu:
ionic start [nombreApp] sidemenu

Isaí Ramírez

student•

El comando que ocupa es:
ionic start geocaching blank

Daniel Batista

student•

Si tienen instalado la version mas actual de ionic y quieren crear este proyecto pero en la version 3 lo pueden hacer de esta manera.

ionic start NombreDeLaApp --type=ionic-angular

Edison Sebastian Mayorga Cifuentes

student•

Excelente aporte

Juan Sebastián Joya Rodríguez

student•

Hola a todos, hice un tutorial sobre como pueden subir su aplicación a github, para que no pierdan información y puedan versionar. Espero les guste.

https://platzi.com/tutoriales/1281-ionic/6854-subir-tu-aplicacion-de-ionic-a-github-2/

Jaasiel Alejandro Castellanos Gomez

student•

como puedes subir un tutorial a la plataforma ?

Jorge Luis Paiva Huamán

student•

Tengo ionic 5.4.16, al crear una app --blank me aparece los mensajes:

request@2.88.2: request has been deprecated,
fsevents@1.2.13: fsevents 1 will break on node v14+
har-validator@5.1.5: this library is no longer supported

Consulta, cómo debemos enfrentar estas alertas no en una nueva aplicación sino para una existente? Qué archivo de log o referencia debemos revisar para llegar a saber qué componente o dependencia excluir de una app existente?

CARLOS ALFREDO ESCOBAR RUPERTI

student•

saludos, ¿Como puedo prepara mi IDE (Visual Code) para " debbugear " en ionic?

Juan Sebastián Joya Rodríguez

student•

Hola, básicamente depende si trabajas con Angular o con React. Si trabajas ocn angular, con las extensiones ts lint y angular language service

juan david jaramillo zuñiga

student•

/node_modules/node-sass/build
        gyp ERR! configure error 
        gyp ERR! stack Error: EACCES: permission denied, mkdir 
        '/Users/juandavidjaramillo/Documents/platzi_ionic/geocatching/geocatching/node_modules/node-sass/build'
        gyp ERR! System Darwin 17.4.0
        gyp ERR! command "/usr/local/bin/node" 
        "/Users/juandavidjaramillo/Documents/platzi_ionic/geocatching/geocatching/node_modules/node-gyp/bin/node-gyp.js" 
        "rebuild" "--verbose" "--libsass_ext=" "--libsass_cflags=" 
        "--libsass_ldflags=" "--libsass_library="
        gyp ERR! cwd 
        /Users/juandavidjaramillo/Documents/platzi_ionic/geocatching/geocatching/node_modules/node-sass
        gyp ERR! node -v v10.1.0
        gyp ERR! node-gyp -v v3.6.2
        gyp ERR! not ok 
        Build failed with error code: 1
        npm ERR! code ELIFECYCLE
        npm ERR! errno 1
        npm ERR! node-sass@4.7.2 postinstall: `node scripts/build.js`
        npm ERR! Exit status 1
        npm ERR! 
        npm ERR! Failed at the node-sass@4.7.2 postinstall script.
        npm ERR! This is probably not a problem with npm. There is likely 
        additional logging output above.
        
        npm ERR! A complete log of this run can be found in:
        npm ERR!     
        /Users/juandavidjaramillo/.npm/_logs/2018-05-15T01_12_49_218Z-debug.log

al momento del npm i sale este error y no se porque es alguien me puede ayudar

juan david jaramillo zuñiga

student•

y por tanto no me deja hacer el ionic serve despues en la clase siguiente

Diego Forero

Team Platzi•

intenta ejecutar con sudo.
sudo npm i

Usuario anónimo

user•

cuando ejecuto comando para crear al app me dice para probar ionic 4, tiene cambios con respecto al curso?

vic ornelas

student•

Entonces esté curso funciona para ionic 4?

Axlin Miranda

student•

Para ejecutar los comando puede ser en cualquier ruta? es que quise hacerlo en C:\xampp7\htdocs\Platzi pero me dice bash: ionic: comando no encontrado, pero cuando ejecute npm install -g ionic me sale esta ruta: C:\Users[windows name folder]\AppData\Roaming\npm

Alexander Sandoval

student•

Si el comando npm install -g ionic se instaló correctamente debes poder utilizar el comando ionic en cualquier lugar. Asegúrate de que la instalación de ionic se haya hecho correctamente.

Mauricio Rivera

student•

Si les sale el error cannot GET/ deben instalar lo siguiente:

sudo npm install --save-dev  --unsafe-perm node-sass

manuel mestas Mestas

student•

estoy usando Ionic 4 y no me sale la opcion de "would you like to integrate your new app with Cordova to target native IOS and Android?", ¿a que se debe esto?

Juan Jose Vega

student•

Con ionic 4 hay que instalar cordova desde un inicio

Juan Guillermo Perez Cardozo

student•

todo muy claro por el momento

Robert Denilson Moreno Carrillo

student•

Si se olvidan de los tipos de proyectos que pueden generar al comenzar, pueden poner simplemente ionic start , la consola les pedirá el nombre del archivo y luego les dejará seleccionar entre los tipos disponibles: blank, sidemenu, tabs.

Rafael Eldanoy Ensuncho Bechara

student•

Comando que se debe correr para crear la App del curso
ionic start geocaching blank

oscar segundo gonzalez palma

student•

Hola quisiera saber a que se debe el que no pueda ver la ayuda al ejecutar: ionic start --help, me salta el error EBADF: bad file descriptor, close

Enrique Rojas Reyes

student•

para los que puedan tener algun problema con la creacion podria desintalar y volver instalar ionic

npm uninstall ionic

ionic start geocaching blank

JAIME VARGAS

student•

muy útil, gracias

Carlos Brandon Sanchez Uribe

student•

Hice el ionic start geocaching blank y no me pidió nada, solo creo y termino, estas son mis versiones de ionic: Ionic CLI: 5.2.1 Ionic Framework: @ionic/angular 4.6.2

Danny Olivares

student•

poco a poco

Johana Marcela Neira Tenorio

student•

Yo uso mas el Blank, cual me recomiendan uds?

/node_modules/node-sass/build
        gyp ERR! configure error 
        gyp ERR! stack Error: EACCES: permission denied, mkdir 
        '/Users/juandavidjaramillo/Documents/platzi_ionic/geocatching/geocatching/node_modules/node-sass/build'
        gyp ERR! System Darwin 17.4.0
        gyp ERR! command "/usr/local/bin/node" 
        "/Users/juandavidjaramillo/Documents/platzi_ionic/geocatching/geocatching/node_modules/node-gyp/bin/node-gyp.js" 
        "rebuild" "--verbose" "--libsass_ext=" "--libsass_cflags=" 
        "--libsass_ldflags=" "--libsass_library="
        gyp ERR! cwd 
        /Users/juandavidjaramillo/Documents/platzi_ionic/geocatching/geocatching/node_modules/node-sass
        gyp ERR! node -v v10.1.0
        gyp ERR! node-gyp -v v3.6.2
        gyp ERR! not ok 
        Build failed with error code: 1
        npm ERR! code ELIFECYCLE
        npm ERR! errno 1
        npm ERR! node-sass@4.7.2 postinstall: `node scripts/build.js`
        npm ERR! Exit status 1
        npm ERR! 
        npm ERR! Failed at the node-sass@4.7.2 postinstall script.
        npm ERR! This is probably not a problem with npm. There is likely 
        additional logging output above.
        
        npm ERR! A complete log of this run can be found in:
        npm ERR!     
        /Users/juandavidjaramillo/.npm/_logs/2018-05-15T01_12_49_218Z-debug.log

Crear una Aplicación

Introducción

Aprende sobre Ionic con los cursos actualizados

Introducción al Curso de Ionic

Pre-Requisitos para este curso de Ionic

Treasure Hunting GeoCatching

Instalación y overview de Ionic CLI

Preparación de entorno de desarrollo en Mac

Preparación de entorno de desarrollo en Windows

Preparación de entorno de desarrollo en Linux

Aspectos Básicos

Crear una Aplicación

Corriendo Aplicación en el Browser

Estructura de Archivos

Estructura de una vista de Ionic

Navegación

Creando un nuevo page

Navegar a un page

Navegación por Tabs

Parámetros de navegación

Navegación hacia atrás

Navegación raíz

Estilos (Theming)

Introducción a estilos

Colores Personalizados

Alineación y transformación de texto

Padding y Márgenes

CRUD en Ionic y Firebase

Generar proyecto e instalar dependencias

Agregar y configurar AngularFire

Agregar servicio de acceso a datos

Crear una lista con array estático

Crear una vista para agregar records

Agregar la habilidad de ver records

Crear lista dinámica y agregar la habilidad de editar records

Agregar la habilidad de eliminar records

Implementando Login con Facebook

Deployment

Correr aplicaciones en emulador

Correr aplicación en dispositivos Android

Correr aplicación en dispositivos iOS

Publicando nuestra aplicación en Android y iOS stores

Conclusiones del curso