Build cross-platform messaging experiences with Stream Chat API. Sign up for Stream's 30 day trial for free: https://gstrm.io/webdevsimplified

Building a chat application is hard, especially if you want it to be a robust and full featured app similar to Facebook Messenger. In this video I will show you how you can use Stream to build out an incredibly robust chat system with ease.


Materials/References:

GitHub Code: https://github.com/WebDevSimplified/facebook-messenger-clone
React Router Video: https://youtu.be/Ul3y1LXxzdU
React Router Article: https://blog.webdevsimplified.com/2022-07/react-router
forwardRef Video: https://youtu.be/zpEyAOkytkU?t=97
forwardRef Article: https://blog.webdevsimplified.com/2022-06/use-imperative-handle/#reactforwardref
React Query Video: https://youtu.be/r8Dg0KVnfMA
CORS Video: https://youtu.be/PNtFSVU-YTI
CORS Article: https://blog.webdevsimplified.com/2021-05/cors
useLocalStorage Hook Video: https://youtu.be/vrIxu-kfAUo
useLocalStorage Hook Video: https://blog.webdevsimplified.com/2019-11/how-to-write-custom-hooks/#uselocalstorage-hook


Find Me Here:

My Blog: https://blog.webdevsimplified.com
My Courses: https://courses.webdevsimplified.com
Patreon: https://www.patreon.com/WebDevSimplified
Twitter: https://twitter.com/DevSimplified
Discord: https://discord.gg/7StTjnR
GitHub: https://github.com/WebDevSimplified
CodePen: https://codepen.io/WebDevSimplified


⏱️ Timestamps:

00:00:00 - Introduction
00:00:30 - Demo
00:02:33 - Server Setup
00:06:21 - Client Setup
00:12:38 - Client Signup Page
00:31:48 - Server Signup Route
00:38:15 - Client Server Connection
00:44:23 - Client Login Page
00:47:17 - Server Login Route
00:49:20 - Client Finish Auth
01:00:54 - Client Chat Page
01:06:29 - Customizing Channel List
01:15:42 - Client Logout Implementation
01:17:54 - Server Logout Route
01:21:17 - Client New Conversation Page


#ChatApp #WDS #Stream