How To Build A Chat App With React And Stream

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:

🌎 Find Me Here:

⏱️ 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

[bluechip]

It's not a true Facebook clone without the spyware.

[benshapiro]

hey man ur probably never gonna see this comment but you are a very big inspiration for me man. whenever im struggling with coding you always got the answer, and you break it down so simply. just wanna say i appreciate your vixeos both for the knowledge the bestow upon society but also for the undeniable drive they incite to do better and build more projects.

[WebDevSimplified]

You can unlock enterprise-grade features, functions, and UI components completely free for your startup or side project with the Maker Account from Stream.

[keremardicli]

That is perfect but a little fast advanced for a newbie

[devjunioralves]

This class is definitely going to be amazing!

[spyce_rn]

I just saw the notification on my mac book.. You don't disappoint

[bayanonymous]

Thank you so much! Just built it out right now, finished and ready to go!

[ChildrenOfDemiurgos]

Been following Kyle for a while and his channel just keeps getting better and better. So Kyle, how's you shredding skills, we are still waiting for some shredding here 😀.
Master Of Puppets please 🤘💥🎸💥🤘

[GooseGumlizzard]

Okay you're a way better developer than me but I bet I could smoke you in a guitar duel!! lol great content you've helped me a lot over the years.

[ivanrobles]

This is awesome! Could you do a follow up and show how to send events with Stream?? Like if I clicked a button, for other users on the channel to receive/listen to that event and recreate it on their side

[agonyman]

I see you use static env, if you know and would be interested would be nice to drop this guide on dynamic runtime config env because on vite it seems to be a bit of pain that has to be handled individualy for each stage of the project :/

[luciusartoriusdante]

So... basically we could have our homebrewed messenger app. Nice!

[marvelBoy]

It would be awesome if u show how to deploy this.

[denissorn]

This is more like building a client/GUI app for a chat application, which is proprietary service, collects your metadata, probably text messages too unless you yourself implement e2e encryption.

[Optional_EH]

Hello,
I finished high school in 2015, but due to financial difficulties, I was unable to continue my education. At the moment, I'm studying FULL Stack Web Development at a institute. I have a 7+ year study gap. Can I still find a job after that?

[milopy]

Incredible video, thanks for share it!

[ParadoxicalMilkSnare]

Good stuff, love your work my guy. I was kind of hoping that the API wouldn't cost a min of $499 a month though. As a beginner react dev it makes it hard to be able to feature anything we make based off your lesson for a portfolio or job application ( I was in the industry pre OO & ES6, round the time jQuery was hefty in use, and am keen to get back into it now after going down a different path for a while ). Any chance you'd be able to make a tutorial for a super simple version of a chat system in future using bare basics like node, react & graph QL kind of thing? again love your work man. Cheers!

[mznunaya]

YES! Come 👏 through 👏 Kyle 👏

MY MAN 😄

[Siegfried-qy]

Many thanks for the always all great content
Just 1 question, around 55:00, in the useEffect to set the streamChat, instead of the isInterrupted logic, couldn t we check for the streamChat to be defined, and is yes, just to return ?..

[johnadriandodge]

Shalom again Jedi K, this is another one, I want to work on with you.