React Native: Apps para iOS y Android

React Native: Aplicaciones nativas para IOS y Android

Este curso de React Native que te dará bases sólidas para trabajar con este framework.

Adquirir Ahora Vista previa gratis

Contenido del curso

1. Introducción
2. ¿Cómo funcionará el curso?
3. ¿Cómo realizar preguntas?
4. Instalaciones necesarias y recomendadas
5. ¡Únete a Nuestra Comunidad de DevTalles en Discord!
1. Introducción a la sección
2. Temas puntuales de la sección
3. Demostración del objetivo final de la sección
4. Inicio de proyecto - MyFirstApp
5. Hola Mundo
6. Explicación de archivos y directorios
7. Crear pantallas independientes
8. Propiedades de un componente
9. Crear un contador
10. Personalización Pressable
11. Componente personalizado PrimaryButton
12. Tip: ¿Cómo ver los ejemplos de la documentación?
13. Componentes estilizados
14. React Native Paper - Instalación
15. Floating Action Button - FAB
16. Iconos en React Native - Android
17. Iconos en React Native - IOS
18. Configurar iconos globales
19. Resumen de lo aprendido hasta el momento
20. Código fuente de la sección
1. Introducción a la sección
2. Temas puntuales de la sección
3. Box Object Model - Fundamentos del diseño
4. Continuación de proyecto - Diseños y Flexbox
5. Padding, Margin, Border, Width y Height
6. Height, Width porcentual y dimensiones de la pantalla
7. Position - Fundamentos del diseño
8. Posición relativa
9. Posición absoluta
10. Flexbox - Fundamentos del diseño en React Native
11. Flex
12. Flex Direction
13. Align Items
14. Align Self
15. Flex Wrap
16. Preparación para la tarea
17. Tarea sobre diseños
18. Resolución de la tarea de diseños
19. Código fuente de la sección
1. Introducción a la sección
2. Temas puntuales de la sección
3. Demostración del objetivo final de la sección
4. Inicio de proyecto - Calculadora
5. Estructura inicial
6. Diseño de pantalla y estilos globales
7. Botones y estilos
8. Botón de calculadora
9. Completar botón de la calculadora
10. Construir el número base
11. Tarea - Botón de borrar última entrada
12. Solución a la tarea
13. Botones de operaciones aritméticas
14. Realizar el cálculo
15. Extra - Calculadora de Pixel
16. Mostrar el resultado mientras escribe
17. Código fuente de la sección
1. Introducción a la sección
2. Temas puntuales de la sección
3. Demostración de la sección
4. Inicio de proyecto - NavigationApp
5. Explicación sobre el sistema de navegación
6. Archivos y directorios del proyecto
7. React Navigation - Pre-requisitos
8. React Navigation - Stack
9. Navegar a otras pantallas
10. Estilizando el Stack Navigator
11. FlatList - Pantalla de productos
12. Enviar argumentos entre pantallas
13. Stack - PopToTop
14. React Navigation - Drawer
15. Configurar Drawer básico
16. Toggle Drawer - Mostar / Ocultar
17. Drawer personalizado
18. useSafeAreaInserts
19. Código fuente de la sección
1. Introducción a la sección
2. Temas puntuales de la sección
3. Demostración objetivo de la sección
4. Continuación de proyecto
5. Explicación sobre el Bottom Tab Navigator
6. Crear el BottomTabNavigator
7. Personalizando el BottomTabNavigator
8. Menú de hamburguesa
9. Material Top Tab Navigator
10. Iconos - Instalaciones
11. Instalación de íconos en IOS
12. Colocando íconos
13. Código fuente de la sección
1. Introducción a la sección
2. Temas puntuales de la sección
3. Introducción - Gestor de estado
4. Inicio de proyecto - Context App
5. Preparación de la aplicación y tarea
6. Resolución de la tarea
7. Zustand - Gestor de Estado
8. Cambios en el Store
9. Tarea - CounterStore
10. Solución de la tarea
11. Código fuente de la sección
1. Introducción a la sección
2. Temas puntuales de la sección
3. Demostración del objetivo al final de la sección
4. Inicio de proyecto - MoviesApp
5. Configuración de pantallas y directorios
6. Navegación entre pantallas
7. Obtener películas - TheMovieDB
8. Patrón adaptador - HttpAdapter
9. Caso de uso - Now Playing
10. CustomHook - useMovies
11. Patrón Mapper - MovieMapper
12. Tarea - Casos de uso restantes
13. Resolución de la tarea
14. Explicación adicional y resumen
15. Código fuente de la sección
1. Introducción a la sección
2. Temas puntuales de la sección
3. Demostración de la sección
4. Continuación de la aplicación
5. Carrusel de posters
6. Terminar carrusel y navegación
7. Carrusel de películas con FlatList
8. Infinite Scroll - Horizontal
9. Infinite Scroll - Parte 2
10. Información de la película por ID
11. Get Movie - Caso de uso
12. Pantalla de detalles - Header
13. Detalles de la película
14. Estructuras de datos para los actores
15. Mostrar actores en pantalla
16. Variables de entorno en React Native
17. FullScreen Loader
18. Código fuente de la sección
1. Introducción a la sección
2. Temas puntuales de la sección
3. Demostración del objetivo final de la sección
4. Continuación de proyecto - ComponentsApp
5. Carousel - Slideshow introductorio
6. Paginación de Slides
7. Theme Light y Dark - Generalidades
8. ThemeContext
9. Cambiar entre Light y Dark
10. Resolución de la tarea
11. React Navigation Theme
12. Tema basado en el Sistema Operativo
13. Estado de la aplicación - AppState
14. Simplificar los componentes del tema
15. Código fuente de la sección
1. Introducción a la sección
2. Temas puntuales de la sección
3. Demostración de la sección
4. Inicio de proyecto - Pokédex
5. Stack Navigator
6. Estructura de directorio a usar
7. React Native Paper
8. Tema light y dark automático
9. Interfaces, entidades y petición http
10. TanStack Query - Peticiones y caché
11. Interfaces de PokeAPI
12. Mapeo de PokeApi a Entidad
13. Diseño del HomeScreen
14. Diseño del HomeScreen Parte 2
15. FadeIn Image y useAnimation
16. Detectar el color predominante
17. Pokémons InfiniteScroll
18. Navegar a la pantalla de detalle
19. Pantalla del Pokemon y Formato
20. Actualizar caché de antemano
21. Información adicional del Pokemon
22. Código fuente de la sección
1. Introducción a la sección
2. Temas puntuales de la sección
3. Demostración del objetivo final de la sección
4. Continuación de proyecto - Pokédex
5. SearchComponent - Diseño
6. Pre-cargar la información para buscar por nombre
7. Filtrar listado por id y nombre
8. Mostrar resultados en pantalla
9. useDebounceValue - CustomHook
10. Código fuente de la sección
1. Introducción a la sección
2. Temas puntuales de la sección
3. Demostración del objetivo final de la sección
4. Inicio de proyecto - MapsApp
5. Instalar iconos
6. Rutas y StackNavigator
7. Android: Configuración inicial de permisos de GPS
8. IOS: Configuración inicial de permisos de GPS
9. Solicitar y revisar permisos - Request Permission
10. Revisar permiso de ubicación
11. PermissionStore - Zustand
12. Consumir nuestro Store
13. Revisar el permiso de GPS al regresar a la aplicación
14. Loading Screen - Pantalla de espera
15. Código fuente de la sección
1. Introducción a la sección
2. Temas puntuales de la sección
3. Demostración del objetivo final de la sección
4. Continuación de proyecto - MapasApp
5. Configuración de GoogleMaps
6. Configurar IOS y Android
7. Marcadores y componente Mapa re-utilizable
8. MapView - Mostrar la ubicación del usuario
9. Acciones de localización
10. Store - Información de la ubicación
11. FAB - Componente personalizado
12. Mover la cámara a las coordenadas del usuario
13. Acciones de seguimiento y limpieza
14. Seguimiento de usuario - Store
15. Darle seguimiento al usuario (Mover cámara constantemente)
16. Detener seguimiento
17. Mostrar y ocultar las polylines
18. Código fuente de la sección
1. Introducción a la sección
2. Temas puntuales de la sección
3. Descarga y configuración del backend
4. Funcionamiento del backend
1. Introducción a la sección
2. Temas puntuales de la sección
3. Demostración del objetivo final de la sección
4. Inicio de proyecto - ProductsApp
5. Preparación de archivos y directorios
6. Stack Navigator
7. UI Kitten - Componentes estilizados
8. Diseño del login
9. Componente personalizado - MyIcon
10. Pantalla de registro y navegación
11. Variables de entorno
12. Axios - Preparar cliente
13. Acciones de autenticación
14. Auth Store - Fuente central de información
15. Obtener token de autenticación
16. Async Storage
17. Verificar estado de la autenticación
18. AuthProvider
19. Cerrar sesión
20. Código fuente de la sección
1. Introducción a la sección
2. Temas puntuales de la sección
3. Objetivo al final de la sección
4. Continuación de proyecto
5. Product - Interfaces y petición HTTP
6. Explicación de lo sucedido
7. TanStack Query
8. MainLayout - Diseño y AppBar
9. Listado de Productos - Parte 1
10. Listado de Productos - Parte 2 - Tarjetas
11. useInfiniteQuery - InfiniteScroll de productos
12. Pantalla de Producto
13. Diseño de la pantalla de producto
14. Selectores de Género y Talla
15. Formik - Formulario de producto
16. Actualizar producto
17. useMutation - TanStack
18. Actualizar caché del query client
19. Actualizar caché - PullToRefresh
20. Componente FAB
21. Creando un nuevo producto
22. Detalles finales y optimizaciones
23. Código fuente de la sección
1. Introducción a la sección
2. Temas puntuales de la sección
3. Objetivo al final de la sección
4. Continuación de proyecto - ProductsApp
5. Preparar el UI para abrir la cámara
6. Abrir la cámara y tomar una fotografía
7. Probar cámara en dispositivo físico
8. Seleccionar de la galería de fotos
9. Subir imagen a nuestro backend
10. Código fuente de la sección
1. Introducción a la sección
2. Temas puntuales de la sección
3. Preparación de proyecto
4. Android: Cambiar ícono y nombre
5. IOS: Cambiar ícono y nombre
6. Cambiar Bundle Identifiers
7. Android: SplashScreen y ajustes
8. IOS: SplashScreen y ajustes
9. Generar Android App Bundle - AAB
10. Subir AAB a la PlayStore
11. Configuraciones adicionales en la Google PlayStore
12. IOS: Portal de developer de Apple
13. TestFlight - Probar la aplicación
14. Código fuente de la sección
1. Más información sobre nuestros otros cursos
2. Información adicional sobre React Native
3. Fin y cierre del curso

Acerca de este curso

355 lecciones
33 horas de contenido en video
USD 50.00

Cursos que podrían intesarte

+DevTalles

Este segmento es exclusivo para sesiones en vivo con Fernando Herrera. Durante estas podrás realizar preguntas relacionadas al contenido de sus cursos y participar de forma interactiva con los panelistas. Se incluyen grabaciones de sesiones pasadas.

Pago único

Adquiere el curso con un único pago de forma vitalicia, con acceso a la comunidad y posibles actualizaciones futuras.

$50.00

Promociones y descuentos pueden aplicar.

Comprar ahora

Suscripción
Devtalles PRO Mensual

^USD16

Suscribirme ahora

Acceso ilimitado a toda la plataforma, cursos, clases en vivo, acceso anticipado a cursos durante el mes de vigencia.

Suscripción
DevTalles PRO Trimestral

^USD48

Suscribirme ahora

Acceso ilimitado a toda la plataforma, cursos, clases en vivo, acceso anticipado a cursos durante 3 meses de vigencia.

Suscripción
DevTalles PRO Semestral

^USD96

Suscribirme ahora

Acceso ilimitado a toda la plataforma, cursos, clases en vivo, acceso anticipado a cursos durante los 6 meses de vigencia.

Suscripción
DevTalles PRO Anual

^USD176

El mejor precio disponible

Suscribirme ahora

Adquiere 1 año entero de suscripción al precio de 11 meses. Obtienes acceso ilimitado a toda la plataforma, comunidades, cursos, clases en vivo, acceso anticipado a una comunidad exclusiva y cursos en construcción.

¿Cuál es el siguiente paso?

Si quieres profundizar tu conocimiento en React, te invitamos a seguir el Programa React Expert diseñado para que sigas aprendiendo.

Ver programas

React Native: Aplicaciones nativas para IOS y Android

Contenido del curso

Sección 1: Introducción

Sección 2: Reforzamiento de las bases - Conocimiento requerido para continuar

Sección 3: Instalación y configuración de ReactNative con emuladores y dispositivos físicos

Sección 4: Mi primera App en React Native - CounterApp

Sección 5: Flex, Position y Box Object Model

Sección 6: Aplicación - Calculadora de IOS

Sección 7: NavegaciónApp - Todos los tipos de navegación

Sección 8: Tabs, MaterialTabs y Material Top Scrollable Tabs

Sección 9: Compartir estado global - Zustand

Sección 10: Aplicación de Películas

Sección 11: Aplicación de películas - Segunda Parte

Sección 12: Componentes de ReactNative

Sección 13: Temas y Slideshow de pantalla completa

Sección 14: Pokedex

Sección 15: Debouncer y Búsquedas

Sección 16: RutasApp - Permisos - Aplicación con mapas - Google y Apple Maps

Sección 17: RutasApp - Aplicación con mapas - Google y Apple Maps

Sección 18: Autenticación y Productos - Backend

Sección 19: Autenticación - ProductsApp

Sección 20: Productos

Sección 21: Cámara, galería y carga de imágenes al backend

Sección 22: Despliegues en Google Play Store y Apple App Store

Sección 23: Despedida del curso

Acerca de este curso

Cursos que podrían intesarte

+DevTalles

TypeScript: Tu completa guía y manual de mano.

React PRO: Lleva tus bases al siguiente nivel

Next.js: El framework de React para producción

Pago único

$50.00

Suscripción
Devtalles PRO Mensual

Suscripción
DevTalles PRO Trimestral

Suscripción
DevTalles PRO Semestral

Suscripción
DevTalles PRO Anual

¿Cuál es el siguiente paso?

Sección 1: Introducción

Sección 2: Reforzamiento de las bases - Conocimiento requerido para continuar

Sección 3: Instalación y configuración de ReactNative con emuladores y dispositivos físicos

Sección 4: Mi primera App en React Native - CounterApp

Sección 5: Flex, Position y Box Object Model

Sección 6: Aplicación - Calculadora de IOS

Sección 7: NavegaciónApp - Todos los tipos de navegación

Sección 8: Tabs, MaterialTabs y Material Top Scrollable Tabs

Sección 9: Compartir estado global - Zustand

Sección 10: Aplicación de Películas

Sección 11: Aplicación de películas - Segunda Parte

Sección 12: Componentes de ReactNative

Sección 13: Temas y Slideshow de pantalla completa

Sección 14: Pokedex

Sección 15: Debouncer y Búsquedas

Sección 16: RutasApp - Permisos - Aplicación con mapas - Google y Apple Maps

Sección 17: RutasApp - Aplicación con mapas - Google y Apple Maps

Sección 18: Autenticación y Productos - Backend

Sección 19: Autenticación - ProductsApp

Sección 20: Productos

Sección 21: Cámara, galería y carga de imágenes al backend

Sección 22: Despliegues en Google Play Store y Apple App Store

Sección 23: Despedida del curso

Acerca de este curso

+DevTalles

TypeScript: Tu completa guía y manual de mano.

React PRO: Lleva tus bases al siguiente nivel

Next.js: El framework de React para producción

$50.00

Suscripción Devtalles PRO Mensual

Suscripción DevTalles PRO Trimestral

Suscripción DevTalles PRO Semestral

Suscripción DevTalles PRO Anual

Suscripción
Devtalles PRO Mensual

Suscripción
DevTalles PRO Trimestral

Suscripción
DevTalles PRO Semestral

Suscripción
DevTalles PRO Anual