Crea tu propio WhatsApp desde cero

Crea tu propio WhatsApp desde cero

Desarrolla tu propia app de mensajería con React Native, Socket IO, Node, Express, Jwt, Real Time, Navigation, etc...

Nuevo
5,00(2 valoraciones)

Creado por Agustin Navarro Galdon

Última actualizacion: 02/2024

Comenzar ahora

Contenido del curso

Introducción2 clases
Resultado final de la app
Repositorio de la app
Entorno de desarrollo8 clases
Configurando Visual Studio Code
Instalando Node JS
Instalando YARN
Creando un nuevo proyecto
Virtualización de un iPhone
Virtualización de un Android
Ejecutando la app en teléfonos físicos
Instalando Insomnia REST
Inicializando app - BACKEND9 clases
Creando el proyecto de node
Creando el servidor de express y socket io
Definiendo las acciones de sockets
Conectando una base de datos MongoDB
Configurando Body Parser
Carpeta estatica
Configurando CORS
Configurando logger HTTP request
Configurando nodemon
Sistema de autenticación - BACKEND7 clases
Modelo del usuario
Estructura de endpoints
Endpoint registro de usuario
Endpoint para el login
Devolviendo JWT en el login
Refrescando AccessToken
Middleware de autenticación
Sistema de usuarios - BACKEND5 clases
Estructura de endpoints
Obtener datos del usuario logeado
Obtener todos los usuarios
Obtener un usuario por ID
Actualizar los datos del usuario
Sistema de chats - BACKEND6 clases
Modelo del chat
Creando estructura
Creando un nuevo chat
Obtener los chats
Eliminando chat
Obteniendo los datos de un chat
Sistema mensajes de chats - BACKEND8 clases
Modelo del mensaje del chat
Creando estructura
Enviando mensaje de texto
Enviar un mensaje de imagen
Obtener los mensajes del un chat
Obteniendo total de mensajes de un chat
Obtener el ultimo mensajes del chat
Añadiendo la fecha del ultimo mensaje en el chat
Sistema de grupos - BACKEND10 clases
Modelo del grupo
Creando estructura
Creación de un grupo
Obteniendo todos los grupos de un usuario
Obtener la información de un grupo
Actualizando grupo
Salir de un grupo
Añadiendo participantes a un grupo
Baneando participantes de un grupo
Obtener usuario que no participan en el grupo
Sistema mensajes de grupos - BACKEND8 clases
Modelo del mensaje del grupo
Creando estructura
Enviando mensaje de texto
Enviando mensaje de imagen
Obtener todos los mensajes de un grupo
Obtener todos los mensajes de un grupo
Obteniendo el ultimo mensaje del grupo
Añadiendo la fecha del ultimo mensaje en el grupo
Inicializando app - FRONTEND3 clases
Creando la app
Instalando Native Base
Instalando React Navigation
Sistema de navigation - FRONTEND11 clases
Creando todas las screens
Definiendo nombres de las screens
Handler de navegación
AuthNavigation
Icono back para las screens
Estilos para los navigations
Creando el AppNavigation
Creando los stacks de Chats, Grupos y Ajustes
Creando BottomTabNavigation
Añadiendo iconos al menu
Añadiendo screen globales
Sistema de autenticación - FRONTEND16 clases
AuthContext
Custom hooks useAuth
AuthStartScreen
Register y Login Screen
Formulario de registro
Controlando y validando formulario de registro
Registrando usuario
Formulario de login
Controlando y validando formulario
Iniciando sesión
Generando la sesión
Guardando los tokens en el AsyncStorage
Recuperando la sesión del usuario
Cerrando sesión
ReLogin y RefreshAccessToken
UpdateUser
Configurando Sockets - FRONTEND1 clases
Inicializando los sockets
Sistema de ajustes - FRONTEND10 clases
Información del usuario
Opciones de ajustes
Abriendo galeria del telefono
Actualizando avatar del usuario
Refrescando avatar
Abriendo formularios
Formulario para cambiar nombre
Validando y contorlando formulario
Actualizando nombre del usuario
Formulario para cambiar apellidos
Sistema de chats - FRONTEND20 clases
Botón para crear chats
Obteniendo usuarios
Listando usuarios
Añadiendo buscador de usuarios
Logica para buscar usuarios
Creando el chat
Obteniendo todos los chats
Loading screen
Renderizando la lista de chats
Estructura del chat
Información del usuario del chat
Ultimo mensaje enviado
Total de mensajes sin leer
Alerta para eliminar un chat
Eliminando un chat
Recibiendo mensajes por sockets
Ordenando chats por último mensaje recibido
Actualizando total de mensajes sin leer
Entrando en un chat
Buscador de chats
Sistema del chat - FRONTEND30 clases
Creando cabecera
Obteniendo los datos del chat
Mostrando información del usuario del chat
Alerta eliminar chat
Entrando en el perfil del usuario
Obteniendo datos del usuario
Pintando datos del usuario
Obteniendo mensajes
Marcando mensajes leidos
FIX: Marcado mensajes leidos
Marcar y desmarcar chat activo
Pintando mensajes
Mensajes de texto
Mensajes de imagen
Abriendo imagen del chat
Empezando el chat desde el ultimo mensaje
Obteniendo mensajes por sockets
Input para enviar mensajes
Moviendo teclado
Controlando y validando input
Enviando mensaje de texto al chat
ActionSheet para enviar multimedia
Opción de galeria
Enviando imagen al chat
Opción de camara
Abriendo y mostrando la camara
Diseñando cámara
Funcionalidad de los botones de la camara
Mostrando foto capturada
Enviando foto al chat
Sistema de grupos - FRONTEND20 clases
Botón para crear grupos
Obteniendo usuarios
Creando los steps
Renderizando los usuarios
Marcando usuarios
Buscador de usuario
Formulario de creación de grupos
Controlando y validando formulario
Seleccionando imagen del grupo
Creando el grupo
Obteniendo grupos en los que participo
Renderizando grupos
Pintando grupos
Obteniendo total de mensajes sin leer
Obteniendo el ultimo mensaje
Abriendo el grupo
Implementando sockets
Subiendo grupo arriba al recibir mensaje
Actualizando total de mensajes sin leer
Buscador de grupos
Sistema del grupo33 clases
Header del grupo
Obteniendo datos del grupo
Estructura del perfil de grupo
Salir del grupo
Información sobre el grupo
Actualizando imagen del grupo
Abriendo formulario para cambiar nombre
Controlando y validando formulario
Actualizando nombre del grupo
Listando participantes
Expulsando participantes
Añadiendo participantes a un grupo existente
Listado usuarios
Marcando nuevos participantes
Añadiendo nuevos participantes al grupo
Añadiendo buscador de usuarios
Marcando grupo activo
Obteniendo mensajes del grupo
Marcando mensajes leídos
Verificando el tipo de mensaje
Renderizando mensaje de texto
Renderizando mensaje de imagen
Auto scroll al entrar en el grupo
Input para enviar mensajes
Obteniendo mensajes en tiempo real
Controlando y validando formulario
Animando input al abrir el teclado
Enviando mensaje al grupo
Añadiendo el SendMedia
Opción de abrir galeria
Enviando imagen al grupo
Opción de abrir cámara
Enviando imagen de la camara al grupo
Deploy7 clases
Creando una cuenta en railway
Subiendo server a GitHub
Desplegando servidor de railway
Conectando app al servidor
Configuraciones previas
Generando el APK
Generando el IPA
Solución a posibles errores2 clases
Error intl de Luxon
Error while updating property 'flex'

Comentarios de los estudiantes

5.0

Valoración del curso

Valoraciones

No se ha escrito ningún comentario para la calificación que has seleccionado.

Crea tu propio WhatsApp desde cero
Comenzar ahora

Este curso incluye:

216 recursos educativos

Certificado de finalizazión

Consultas al tutor gratuitas

Compatible con todos los dispositivos

Compartir

Instructor del curso

Crea tu propio WhatsApp desde cero

Agustin Navarro Galdon

Frontend Developer

Soy un desarrollador de aplicaciones multiplataforma, mobile y E-Commerce con más de 7 años en el mundo del desarrollo de aplicaciones de todo tipo.