Realtime Features for React: Easier Than You Think

When I was new to web dev, implementing real-time features into your apps seemed like a nightmare. So many things to keep in mind. How to deploy the web sockets? How to manage scaling? I think this might be one of the most beginner-friendly approaches to implementing real-time features into your own app.

I wish you a lot of fun implementing real-time features into your app! Let me know if you build something cool with it! Cheers

[faizanahmed]

Thanks a lot! I was just looking the docs for pusher and was not understanding much and you've just dropped a video.

[NinjaNezie]

Needed this for a clock in system I’m building. Very nice tutorial 🔥.

[malamhari_]

Thanks, this video is very helpful to grasp the basic of Pusher
Hope you do well onwards!

[angzar]

Excellent Josh, great video as always. ...(ps. prisma format -> makes it so pretty)

[ammarys]

bro you just created a conclusion for their bad documents, that's hard to believe, YOU A LIFE SAVER.

[Subhamremady]

amazing bro. It was really something new for me . THnakss for the video

[astronaut]

can we use pusher to implement ads campain feature like google ads, I mean showing users data as ad in queue in real time ?

[siosaiafonua]

can react query do the same thing? provide real time updates?

[jnayehsirine]

KEEP GOING !!!, you have such GOOOD content

[mateuspaula_dev]

Good video, thank you very much for sharing your knowledge. I really hope you keep producing videos with the same intensity.

Best regards, all the best from Brazil 🇧🇷

[josht]

Great tutorial! But what if I have multiple channel I need to listen to? Do I need to create one useEffect per channel or put all listeners in one useEffect?

[NhanNguyen-ngvn]

Today, i'm creating a chat in my school'project, and i don't khow how to unsubcribe channel_name inside return callback of UseEffect. Thanks you !

[murphyvanoijen]

@Josh,
Great video again. Does this also work in NextJS 12?

[AssBlasterChan]

have you got a repo for reference? Curious how to set up the part where pusher talks to the db to preserve the state

[edihasrin]

hi josh,
Can you explain how to use SWR for realtime data. From the info I got on Twitter, it says it doesn't use third party services / web scoket.

i am very interested about that

[krisbude]

nice video Josh. Just one thing... I wouldn't teach other developers to use a let in a react client component instead of the useState hook. In this particular case it works because you don't have any parent component. But it is really a bad practice and should not be used in a client component to maintain state.

[TheDionysiac]

I'm not overly familiar with Prisma, but I was under the impression that you needed to set it up to work with a 3rd party DB service like Supabase or Planetscale. If so, which are you using in this project? If not, where is the database located?

[alexmagwe]

why dint you use useState for the input value?

[acupofkoffi]

Hi. How long have you been learning web dev?

[hnmss]

Is it complex to setup a internal websocket on NextJS ?! 😢