React Native - Crea aplicaciones para Android y iOS c/ React

Name: React Native - Crea aplicaciones para Android y iOS c/ React
Rating: 4.5 (2602 reviews)

Aprende a crear aplicaciones iOS y Android con React, incluye: React Navigation, GraphQL, MongoDB, Firebase y más!

Created byJuan Pablo De la torre Valdez

Last updated 7/2022

Spanish

What you'll learn

React Native para Crear Apps para Android y iOS
Frameworks UI para React Native como NativeBase y React Paper
GraphQL y Apollo Server con React
React Navigation v5
Firebase con React Native
Estilos a tus Apps y los diferentes componentes de React Native
Consumir API's y mostrar sus resultados en React Native
Temas Intermedios de React Native como API's Storage Frameworks UI
Temas Avanzados de React como Apollo, MongoDB, Autenticación y más

Course content

30 sections • 392 lectures • 29h 8m total length

RestaurantApp - App para restaurantes en Tiempo Real5:28
Veamos el Proyecto de RestaurantApp!
UpTask - Administrador de Proyectos con GraphQL, Apollo Server y MongoDB6:17
Veamos el Proyecto Uptasks con GraphQL, MongoDB y Apollo
El Resto de los Proyectos7:48
Veamos los demás proyectos que se incluyen en este curso!
¿Qué es React?2:36
En este video veremos que es React!

¿Cuánto JavaScript debo saber antes de React y React Native? Introducción2:17
¿Cuánto JS debo saber antes de React? mientras más sepas siempre será mejor, pero veamos los temas más utilizados
Variables con let (descarga materiales aquí)6:41
Veamos como definir las variables con let
Variables con const3:55
Veamos como se diferencian las variables con const de las de let
Estructuras y Tipos de Datos12:19
Veamos estruturas y tipos de datos en JS
Introducción a Objetos8:18
Uno de los temas centrales de React y JS son los objetos, veamos como funcionan
Manipulación de Objetos4:08
En este video veamos sobre modificar Objetos
Destructuring de 2 o más objetos3:16
Veamos como aplicar Destructuring a 2 objetos o más
Unir 2 o más objetos5:18
Veamos como unir 2 objetos
Introducción a Arrays3:47
Veamos una introducción a Arrays
Manipulación de Arrays10:44
En este video veamos como manipular Arrays!
Destructuring de arrays4:34
Veamos como funciona el destructuring de arrays
Iteradores de Arreglos4:13
Veamos como iterar en los arreglos
Funciones - Function declaration3:43
Veamos como escribir funciones en JS
Funciones - Parámetros y Parámetros por Default4:05
Veamos que son los parámetros
Funciones que retornan valores3:36
Veamos que son las funciones que retornan valores
Funciones - Function Expression3:49
Veamos otra forma de crear funciones
Funciones - Arrow Functions4:26
En este video veamos sobre los arrow functions
Arrow Functions y Array Methods3:08
Veamos un poco sobre Arrow Functions y Array Methods!
Otros Array Methods útiles11:12
Veamos otros Array Methods muy útiles
Condicionales - if3:59
Veamos como escribir código condicional
Condicionales - Comparación con == y ===4:34
Veamos más sobre operadores en JS
Condicionales - Condición || y &&4:46
Veamos como revisar que se cumpla más de una condición o al menos 1
Condicionales - Ternarios4:42
Veamos que son los Ternarios
Scope de Variables3:30
En este video conoceremos sobre el scope de las variables
Selectores del DOM - querySelector5:23
Veamos como seleccionar elementos con QuerySelector
Selectores del DOM - querySelectorAll2:41
querySelectorAll te va a retornar múltiples elementos HTML, veamos como funciona
Manipular HTML con JS4:29
Veamos como modificar el código HTML con JS
Eventos del DOM - Clicks5:56
Veamos como escuchar por un evento Click
Eventos del DOM - Inputs8:06
En este video veamos sobre los eventos que ocurren en un Input
Eventos del DOM - Submit6:13
Veamos como escuchar cuando ocurra el evento de Submit
Generando código HTML con JavaScript6:52
Veamos como generar código HTML en JS
Imports y Exports6:34
En JS es posible importar variables y funciones de otros archivos, veamos como funciona
Fetch API y Promises5:27
Veamos como funciona Fetch API
Fetch API con Async Await4:15
Veamos como realizar una consulta con Fetch y Async Await
Múltiples Async / Await y Performance8:43
Veamos como manejar múltiples Async Await
Template Strings5:20
Veamos que son los Template Strings

Instalar Chocolatey (descargar materiales aquí)2:45
En este video veremos como instalar Chocolatey
Instalar Node y Java Development Kit2:04
Veamos como instalar Java Development Kit
Instalar Android Studio2:25
Veamos como instalar Android Studio
Instalar Android SKD2:16
Veamos como instalar y añadir más SDK
Crear un AVD4:41
Veamos como crear emuladores para Android
Añadir Android al PATH5:07
Veamos como añadir Android al Path
Lanzar los Emuladores desde la Terminal2:38
Veamos como lanzar los emuladores desde la terminal
Conectar un dispositivo fisico por USB2:49
Veamos como conectar un dispositivo fisico
Crear y Compilar tu primer App4:38
En este video vamos a crear y compilar nuestra primer app
Instalar React Dev Tools6:02
En este video vamos a instalar React Dev Tools!
Instalar Flipper5:06
Veamos que es Flipper y como instalarlo

Instalar Xode1:28
Veamos como instalar Xcode!
Instalar Homebrew2:53
En este video vamos a instalar Homebrew
Instalar Watchman y Node.js2:28
Veamos como instalar Watchman y Node.js
Instalar o Verificar Command Line Tools1:06
Veamos como instalar command line tools
Instalar Cocoapods1:55
Veamos como instalar Cocoapods
El Simulador de iOS2:42
Veamos como configurar el Simulador de iOS
Crear y compilar tu primer app8:27
Veamos como crear y compilar tu primera app
Instalar Flipper5:41
Veamos que es y como instalar Flipper

Descargar Android Studio (descarga materiales aquí)4:23
Veamos como descargar e instalar Android Studio
Instalar Watchman y Node1:14
Veamos como instalar Watchman y Node
Instalar Java Development Kit1:22
Veamos como instalar Java Development Kit
Instalar Android SDK1:55
En este video vamos a instalar Android SDK
Crear un Android AVD2:20
Veamos como crear una máquina virtual de Android
Añadir Android al PATH4:19
Veamos como Añadir Android al PATH
Lanzar Emuladores desde la Terminal2:36
Veamos como identificar y lanzar emuladores desde la terminal!
Conectar un dispositivo Físico2:16
Veamos como conectar un dispositivo físico a nuestra computadora y compilar nuestras apps
Crear y Compilar tu primer app6:14
Veamos como crear y compilar nuestra primer app
Instalar Flipper5:41
Veamos que es y como instalar Flipper

El Proyecto Finalizado2:29
El Código Finalizado (descarga aquí)1:53
Cómo Pedir Ayuda5:24
Primeros pasos y Hola Mundo4:27
Vamos a comenzar este proyecto!
¿Qué son los Componentes de React Native?2:46
En este video veremos que son los Componentes
Solución al Reto0:35
Veamos la solución de este reto!
¿Qué es JSX?4:53
En este video veremos que es JSX
Estilos en React Native y StyleSheet6:25
Veamos como se le dan estilos a las apps de React Native
Primeros Estilos en nuestra app3:20
Vamos a comenzar a escribir los estilos!
Eventos en React y React Native3:37
Veamos sobre Eventos en React y React Native
Eventos con Pressable3:54
Veamos como leer y manejar eventos con Pressable
Estilos a nuestro botón5:08
Vamos a darle estilos a nuestro botón
Incorporando un Modal1:49
Veamos como utilizar un Modal
¿Que son los Hooks?1:25
Veamos que son los React Hooks!
Reglas de los Hooks4:09
Los hooks tienen reglas, así que veamos algunas
¿Qué es el State en react?5:30
En este video veremos que es el state en React
Modificando el State3:04
Veamos como modificar el State!
Extensiones para React Native8:21
Veamos una serie de extensiones útiles para react y react native
Componentes y Props7:18
En este video veremos sobre Componentes y Props!
CSS al Nuevo componente11:14
Veamos como aplicar CSS a este nuevo componente
Creando el State para el Formulario7:02
Veamos como crear y leer el state del Formulario
Instalando un DatePicker9:55
Veamos como instalar paquetes externos!
Agregando un botón para cerrar el Modal6:29
Veamos como añadir un botón para cerrar el modal
Diseñando el Botón para agregar citas3:22
Veamos como diseñar el botón para añadir una cita
Validación y Alert en React Native7:16
Veamos como validar y mostrar una alerta en el formulario
Modificar el State de pacientes4:47
Veamos como modificar el state cuando se añade un nuevo paciente
Reiniciar el Formulario después de agregar el paciente2:23
Veamos como reiniciar el Formulario después de enviarlo
FlatList e iterar sobre grandes colecciones de datos9:12
Veamos que es el Flatlist y como iterar sobre grandes cantidades de datos!
Mostrando Pacientes y Formatear Fechas4:22
Veamos como mostrar los pacientes en la lista
Estilos al Componente de Paciente4:22
Veamos como añadir estilos al Componente de Pacientes
Creando Botones para Editar y Eliminar4:41
Vamos a añadir botones para Editar y Eliminar Pacientes
Detectando el Paciente a Editar6:58
Veamos como seleccionar un paciente para editarlo
¿Qué es useEffect?8:55
En este video veremos sobre useEffect!
Actualizando Registros10:57
Veamos como actualizar los Registros!
Solucionando errores con una dependencia5:32
Veamos los problemas que te puede causar no añadir una dependencia a useEffect!
Eliminar Pacientes5:41
En este video veremos como eliminar pacientes
Creando un Modal para ver Información de Pacientes4:30
Veamos como añadir un segundo modal!
Pasando el Paciente hacia el Componente2:10
Veamos como pasar el paciente para ver su información
Estilos a la vista del Paciente4:16
Veamos como darle estilos a la vista del paciente!
Sombras en React Native5:06
Veamos como crear sombras en React Native
Finalizando la información del Paciente6:49
Veamos como finalizar este componente!
Finalizando la app8:02
Solucionando algunos detalles antes de finalizar la app!

El Proyecto Finalizado (Código final aquí)3:25
Comenzando el Proyecto y Materiales (descarga materiales aquí)2:55
Comenzando el Layout4:17
Crear el Formulario de Presupuesto y Primeros Estilos6:22
Finalizando los Estilos del Formulario4:14
Validando Presupuesto6:08
Pasando a la siguiente pantalla cuando el presupuesto es válido3:26
Mostrando Imágenes en React Native6:46
Mostrando y formateando cantidades en el Control Presupuesto5:25
Estilos a las Cantidades2:10
Calcular Restante y Gastado8:35
Agregar un Icono para Crear Gastos4:42
Mostrando un Modal al Presionar el botón2:53
Creando el Formulario de Gastos6:28
Estilos al Formulario6:31
Creando un botón para cerrar el Modal3:01
Leyendo los valores del Formulario3:05
Validando el Formulario6:15
Colocando el Gasto en el State5:34
Creando el Componente para Listar Gastos5:08
Primeros pasos con el Componente Listado3:47
Estilos a los Gastos6:57
Mostrando imágenes de la categoría de Gasto4:06
Finalizando el Componente Gasto6:35
Internacionalización para Android3:01
Mostrando la fecha del Gasto4:59
Actualizando lo Gastado y Disponible según se agreguen gastos2:38
Primeros pasos para editar gastos5:19
Llenando el Formulario para editar un gasto6:18
Almacenando el Gasto Editado5:44
Primeros pasos para eliminar un gasto3:38
Eliminando Gastos6:34
Solucionando el Detalle del Botón para añadir gastos2:24
Añadiendo el Circular Progress Bar9:08
Personalizando Circular Progress Bar4:13
Calcular el Porcentaje Gastado4:12
Mostrando el Botón de Eliminar de Forma condicional2:54
Creando el Componente de Filtrar Gastos4:46
Filtrando Gastos por Categoría5:46
Mostrando Gastos Filtrados7:37

Requirements

Haber creado al menos un proyecto de React
Conocer cuando se utiliza useState y cuando useEffect
Componentes Funcionales en React
JavaScript ES6+

Description

¿Deseas crear aplicaciones para Android y iOS con tus conocimientos de HTML, CSS y React? entonces REACT NATIVE es tu mejor opción.

En este curso iremos paso a paso creando Aplicaciones, a diferencia de React DOM, en React Native existe una gran cantidad de componentes para mostrar textos, inputs, botones, formularios, alertas y mucho más!

Aprenderemos Creando Proyectos (en los 3 primeros videos del curso podrás ver todos los proyectos finalizados y lo que aprenderás)

React Native te va a permitir escribir código una vez y compilarlo a iOS y Android.

En este curso aprenderás:

Llevar tus conocimientos de Desarrollo web hacia el mundo de Apps móviles
React Navigation v5
Frameworks UI para React Native (NativeBase y React Paper)
Integrar Firebase a React Native
Consumir API's de Internet y Propias
Animaciones en React Native
Storage
Conectar a un servidor GraphQL, Apollo y MongoDB
Autenticar Usuarios
Crear Apps del Mundo Real
Integrar useReducer y useContext en React Native
y mucho más!

Who this course is for:

Desarrolladores Web con conocimientos en HTML, CSS, JavaScript y React que deseen aprender a crear apps móviles con lo que ya saben
Si deseas convertirte en Desarrollador Full Stack React, este curso es para ti
Si deseas continuar aprendiendo React, este curso es el indicado
Si deseas aprender a Crear Apps para Android y iOS sin aprender Swift o Kotlin, este curso es para ti

React Native - Crea aplicaciones para Android y iOS c/ React

What you'll learn

Explore related topics

Course content

Los Proyectos que construiremos en este curso4 lectures • 22min

¿Cuánto JavaScript debo saber antes de React? Introducción36 lectures • 3hr 15min

Introducción a React Native2 lectures • 3min

Ambiente de Desarrollo en Windows para crear Apps de Android11 lectures • 41min

Ambiente de Desarrollo en Mac para Crear Apps para iOS (Descarga Material aqui)8 lectures • 27min

Ambiente de Desarrollo en Mac para Crear Apps para Android10 lectures • 32min

PROYECTO: Administrador de Citas de Pacientes42 lectures • 3hr 40min

PROYECTO: Planificador de Gastos con gráficas40 lectures • 3hr 18min

Async Storage - Qué es, guardar, obtener y limpiar datos5 lectures • 11min

ASYNC STORAGE - Proyecto Planificador de Gastos6 lectures • 22min

Requirements

Description

Who this course is for: