No hay productos en el carrito.
¿Qué voy a aprender?
¿Interesado en el desarrollo sin real time? ¡Mira este curso!Aprende a desarrollar aplicaciones móviles en tiempo real con React Native y Expo. Utilizaremos Laravel Echo con Socket.IO para aplicar el Realtime y Laravel Sanctum para el sistema de autenticación basado en tokens para rutas API y Canales.
Hoy en día es una necesidad saber desarrollar aplicaciones en tiempo real. Cada vez son más las empresas que solicitan este conocimiento en un desarrollador web o móvil. Si no cuentas con estos conocimientos dejarás de poder atender a posibles cliente que requieran de este tipo de aplicaciones.
A lo largo de este curso de React Native y Laravel Echo crearemos una APP para Android y iOS, algo parecido a un portal para buscar trabajo. Sin entrar en todos los detalles de este tipo de proyectos sí definiremos lo que más nos interesa, autenticación y realtime.
Empezaremos por configurar un proyecto con Laravel 7 utilizando el sistema de Broadcast de Laravel para emitir eventos al cliente utilizando el Middleware de autenticación Sanctum con el fin de proteger nuestros endpoints.
Ya que Laravel será quien comunique a la APP lo que esté sucediendo en nuestra base de datos, crearemos una serie de eventos para actualizar cierta información y así notificar a React Native para que puede actualizar las interfaces de todos los clientes que estén conectados y escuchando los eventos disparados.
Una vez tengamos el proyecto Laravel funcionando empezaremos a desarrollar la aplicación móvil con React Native y Expo. Lo primero será instalar todas las dependencias que necesitaremos. Entre las más importantes cabe destacar las siguientes:
- React Native Paper para definir la interfaz.
- Echo para escuchar los eventos de Laravel.
- Socket.IO, el cliente utilizado por Echo.
- Mobx, mi alternativa a Vuex en React, fácil y genial.
Con el proyecto Expo iniciado y las dependencias instaladas configuraremos babel para mapear nuestro proyecto y tener acceso directo a todos los paths utilizando alias, algo súper recomendable en cualquier proyecto, a esto se le conoce como module resolver.
De aquí en adelante será desarrollar componentes, navegaciones, stores, screens, archivos de constantes, servicios para conectar con Laravel Echo y consumir la API con Axios y todo lo que te puedas imaginar para desarrollar este tipo de proyectos.
Requisitos recomendados para tomar el curso
- Conocimientos de Laravel, aquí tienes tienes un curso gratuito desde 0.
- Conocimientos de JavaScript y HTML
¿Para quién es este curso?
Cualquier desarrollador de aplicaciones web que utilice Laravel y desee aprender a desarrollar aplicaciones móviles en tiempo real con React Native y Expo para Android y iOS desde 0 paso a paso.¿Qué hago si tengo dudas a lo largo del curso?
Si has comprado el curso o estás suscrito al plan Trimestral o Anual cuentas con soporte completo en menos de 24 horas dentro de días laborables.Contenido del Curso
| Introducción | |||
| React Native Echo: ¿Qué vamos a hacer? | GRATIS | 00:06:00 | |
| React Native Echo: Archivos del curso | 00:00:00 | ||
| Desarrollando el proyecto Laravel | |||
| React Native Echo: Crear proyecto y configurar proyecto para utilizar Redis | GRATIS | 00:04:00 | |
| React Native Echo: Configurar Laravel Echo y preparar proyecto Laravel para poder comunicar nuestra APP | 00:06:00 | ||
| React Native Echo: Crear el sistema de autenticación para utilizar Laravel Sanctum con Tokens | 00:09:00 | ||
| React Native Echo: Modelos, migraciones y Seeds | 00:10:00 | ||
| React Native Echo: Crear eventos y definir rutas channel y web | 00:10:00 | ||
| React Native Echo: Crear Resource JobCategory para enviar datos de la API a la APP y actualizar rutas web y API | 00:06:00 | ||
| React Native Echo: Ejecutar comandos para dejar el proyecto Laravel en marcha de forma correcta | 00:06:00 | ||
| Desarrollando la APP con React Native y Expo | |||
| React Native Echo: Introducción a React Native, Expo y revisando las dependencias del proyecto | 00:08:00 | ||
| React Native Echo: Crear proyecto Expo, instalar dependencias y Module Resolver | GRATIS | 00:05:00 | |
| React Native Echo: Aprender a lanzar nuestra APP en dispositivo físico y emulador | GRATIS | 00:05:00 | |
| React Native Echo: Definir archivos de constantes y estilos css con React Native | 00:05:00 | ||
| React Native Echo: Crear la instancia de Laravel Echo de forma correcta | 00:03:00 | ||
| React Native Echo: Servicio Axios para comunicarnos con la API utilizando Sanctum | 00:03:00 | ||
| React Native Echo: Escribir la Store para manejar autenticación con Mobx | 00:10:00 | ||
| React Native Echo: Escribir la Store para modificar la interfaz con Mobx | 00:02:00 | ||
| React Native Echo: Comunicar todas las Stores entre sí con Mobx | 00:03:00 | ||
| React Native Echo: Componente para mostrar un Loader mientras suceden cosas en la APP | 00:04:00 | ||
| React Native Echo: Crear un componente SnackBar que utilizaremos con los canales de Echo | 00:07:00 | ||
| React Native Echo: Crear componente para mostrar errores de validación del servidor | 00:03:00 | ||
| React Native Echo: Crear la pantalla para iniciar sesión | 00:14:00 | ||
| React Native Echo: Crear la pantalla para registrar usuarios | 00:04:00 | ||
| React Native Echo: Crear una navegación por Tabs para usuarios no identificados | 00:06:00 | ||
| React Native Echo: Crear un componente para manejar navegaciones de usuarios invitados e identificados | 00:03:00 | ||
| React Native Echo: Actualizar el punto de entrada de Expo para utilizar los providers Mobx y Paper | 00:09:00 | ||
| React Native Echo: Pantalla Welcome después de iniciar sesión y conectar a canal privado Echo con autenticación | 00:07:00 | ||
| React Native Echo: Crear la navegación por Tabs para usuarios identificados y cambiar navegación de forma dinámica | 00:06:00 | ||
| React Native Echo: Comprobar que la conexión con Laravel Echo entre cliente y servidor funcionan bien | GRATIS | 00:04:00 | |
| React Native Echo: Pantalla para cerrar sesión y comprobar que el socket se desconecta completamente en el servidor | 00:07:00 | ||
| React Native Echo: Pantalla para mostrar la información del usuario identificado haciendo petición a la API | GRATIS | 00:05:00 | |
| React Native Echo: Probar la emisión de eventos desde el servidor y algunos conceptos importantes | 00:05:00 | ||
| React Native Echo: Almacén de datos Jobs con Mobx para gestionar el estado de las categorías de trabajos | 00:07:00 | ||
| React Native Echo: Listar las categorías de trabajos, escuchar y emitir eventos de forma completa y pruebas finales | 00:16:00 | ||
Cursos relacionados
Desarrolla un componente WYSIWYG con galería de imágenes en Laravel
14Opciones de Precio +
Curso de Despliegue con Laravel Forge 2021
20Opciones de Precio +
App con React Native y Laravel Sanctum
21Opciones de Precio +
93 ALUMNOS MATRICULADOS
Buen curso
Se aprende mucho sobre el uso de el realtime con react native y expo
Muchas gracias 🙂
Excelente curso muy bueno y muy bien explicado
Se trata todo los temas con explicación cara y fácil de comprender.
Sugerencia: Seria Interesante un Curso de Vue-Native con Laravel Sanctum o AWS Amplify
Gracias por compartir tanto conocimiento y tan buenos cursos
Muchas gracias Alejandro, muy contento de saber que te ha servido.