¿Qué es Ionic?

1

Requisitos del curso y presentación del proyecto

2

¿Qué hay de nuevo en Ionic 4?

3

¿Qué ha cambiado en Ionic?

4

Instalación de Ionic y templates básicos

5

Instalación de Capacitor y uso en Android Studio

6

Uso de Capacitor y xCode

7

Sincronizando nuestro proyecto con los emuladores

Componentes básicos de Ionic

8

El componente Slides

9

CSS y Custom Properties de los componentes de Ionic

10

Slides dinámicos

11

Angular Router e Ionic Storage

12

Controlar la navegación con Guards

13

Utilidades de CSS con Ionic

14

Crear una página de login

15

Validar inputs del formulario de login

16

Envío del formulario

17

Servicio para validar credenciales

18

Agregar Guards a nuestro login

19

Crear una página de registro

20

Navegación entre login y registro

21

Agregar un menú con el componente Menu

22

Dar funcionalidad y estilos al menú

23

Uso de componente Slides y opciones avanzadas

Consumo y manejo de informacion con Ionic

24

Consumiendo un API para llenar información de nuestros artistas

25

Página completa con artistas, canciones y álbums

26

El componente Modal y el Modal Controller

27

Llenar de contenido el Modal

28

Componente Footer y funcionalidad del Modal

29

Construyendo nuestro reproductor

30

Lógica de nuestro reproductor

31

RETO: Vista de álbums

Acceso al hardware

32

Usar la cámara a través de Capacitor

33

Corrección de errores y afinando detalles

34

Mejorando nuestra página de Settings con CSS

35

Página Sports y Angular Maps

36

Crear la página Sport

37

RETO: Buscador dinámico en Sports

38

Llevar nuestra aplicación a producción con Android

39

Llevar nuestra aplicación a producción con iOS y cierre del curso

Curso de Ionic 4

Curso de Ionic 4

Sebastián Gómez

Sebastián Gómez

Instalación de Ionic y templates básicos

4/39
Recursos
Transcripción

Aportes 26

Preguntas 5

Ordenar por:

¿Quieres ver más aportes, preguntas y respuestas de la comunidad? Crea una cuenta o inicia sesión.

A partir de la versión 5 de ionic se utilizan los siguientes comandos:

$ npm install -g @ionic/cli.
$ npm uninstall -g ionic $ npm install -g @ionic/cli.
$ ionic start myApp tabs.
$ cd myApp $ ionic serve.

Templates

Comence a hacerlo ahora en windows y me pregunta que si suar Angular o React? jajaja ¿Qué debo decir? R: Ya puse Angular, espero que esté bien…

Alguna recomendación?

Excelente profe, con toda hacia adelante…

profesor que theme de oh my zsh es el que utiliza?

Que tal, es facil pasar de ionic 3 a ionic 4 ya que estoy modificando el codigo de una app ya escrita en ionic3

Buenas tardes me sale este mensaje:
An unhandled exception occurred: Job name “…getProjectMetadata” does not exist.
See “C:\Users\johlver\AppData\Local\Temp\ng-oipRP7\angular-errors.log” for further details.
[ERROR] An error occurred while running subprocess ng.

    ng.cmd run app:build exited with exit code 127.

    Re-running this command with the --verbose flag may provide more information..

Me pueden colaborar como lo soluciono. Tengo Windows 10

pueden seguir la instalacion desde aca https://ionicframework.com/docs/installation/cli

Interesante

MUY BIEN !

estoy utilizando windows no me funciono con ls si no con dir.

¿Se pueden añadir templates al cli ionic de alguna manera si tenemos nuestras propias templates desarrolladas?

IONIC 6

Voy a tomar el curso, pero haciéndolo en IONIC 6 y voy a ir dejando mis recomendaciones.

node -v
v16.13.0
.
npm -v
8.2.0
.
npm install -g @ionic/cli
.
ionic
CLI 6.18.1
.
ionic start platzi-music blank --type=angular

-------A mí me salió este enorme error------------
npm install -g @ionic/clli
npm ERR! code E404
npm ERR! 404 Not Found - GET https://registry.npmjs.org/@ionic%2Fclli - Not found
npm ERR! 404
npm ERR! 404 ‘@ionic/[email protected]*’ is not in this registry.
npm ERR! 404 You should bug the author to publish it (or use the name yourself!)
npm ERR! 404
npm ERR! 404 Note that you can also install from a
npm ERR! 404 tarball, folder, http url, or git url.

npm ERR! A complete log of this run can be found in:

-----------SOLUCIÓN---------
If there was a previous installation of the Ionic CLI, it will need to be uninstalled due to a change in package name

$ npm uninstall -g ionic
$ npm install -g @ionic/cli

¡LISTO!, espero les sea de ayuda.

Si desean emprezar con React:

$ npm install -g @ionic/cli
$ ionic start --type=react

$ ionic start helloWorld blank --type=react

si están usando mac y les sale error el npm al querer instalar ionic pueden scribir el “sudo” adelante

sudo npm install -g @ionic/cli

Falto instalar el node.js


😦.
Ayuda comunidad porfa

version de node instalada superior a la 10
Instalación de ionic:

npm i -g ionic

comprobar si esta instalado ionic:

ionic

inicializar el proyecto:

ionic start

correr el proyecto:

ionic serve

Una consulta si no me aparece la opción de blank como puedo empezar a crearlo ya que solo tengo angular y react.

Wow!!

AL usar ionic start, me sale error:
$ ionic start
[WARN] Command ran non-interactively due to --no-interactive flag, CI being detected, non-TTY, or a config setting.
[ERROR] name must not be empty.
[ERROR] template must not be empty.
Use the --help flag for more details.
Lo solucioné con la documentación
Aquí

PD: le incluí la bandera --capacitor, espero sirva 😃

Despues de escogido el template, se puede volver a cambiar en la misma aplicaion?
Gracias de ante mano

como le pongo ese historial al terminal de mac?
Create your first app
Install Ionic and start your app:

npm install -g @ionic/cli
ionic start myApp
Link your app to the Ionic Hub:

ionic link

Algunas veces para poder visualizar de manera más comoda ocupo el comando ionic serve --lab