Wow! This saved me some time and I did not know about Reverb. I am using it for a Book project taking Japanese to other languages and allow users to edit the text. I section text into blocks which could be a paragraph or a sentence and users can see which blocks of text in the book are being edited or have a hold because someone already edited. I used Tailwind as well. Thanks for this wonderful video you put out!
@@christiancolewan I am on macOS, and it's very easy to setup local SSL on macOS. I use Laravel Herd for my local dev environment, you can set local SSL from there. If you're on Windows, Herd is now also available for Windows as well.
Very informative and nicely done. I tried this in my local env. but i cant pass this simple error. I can notice at 8:25 of this video that your console shows the same thing for you as well. Firefox cant establish a connection to wss. I tried both laravel Herd (free) and docker but to no avail. Do you have any guidance for how to resolve this? Thanks in advance
Thanks for the comment, you have to make sure that REVERB_HOST is set your local domain "example.test" and your REVERB_SCHEME is set to https. In some dev environments, some do encounter this issue on Firefox, so far I don't encounter this. Kinda unpredictable, but it should work normally in production.
@@glennraya Thanks for the answer, I already have the env set with the correct data. But i am already at this for 2 days and i slowly lean to giving up :/
If you're developing on Windows but it's working on Webkit browsers (chrome, edge, etc.) it should be fine, other people also have this issue on Firefox on Windows because Firefox seems to have been rejecting local SSL, in production it should be fine. On macOS though, it seems to be ok.
@@JordanJanevski I suggest removing the local SSL and testing it on HTTP only (without SSL), and it should work. I also talked to other people regarding this, and their issue is that the local SSL on Windows seems to be not working on all browsers.
@@glennraya After disabling the SSL in herd, and changing app url and reverb scheme to http, I dont see any differences. I still see the error in the console being for wss.. is windows this bad or is it just me? x.x its the same for both chrome / firefox
Pretty cool! I understand this is a demo but I think instead of $article->user you should pass the logged in user - right? Because the editor is the user who authorizes the delete, and not article_user.
In this context, `$article->user` represents the article's owner, who initiated the delete. I passed this data to ensure the article also disappears for the user who deleted it. Thanks! 🙏🏼
There's no artisan command to generate that unless you install broadcasting from scratch, but you can set it to whatever string/numeric values you want for as long as it is unique. That's all it requires.
Hey, Its a nice work. what if i host my reverb application as a middleware to send notifications from a server and my frontend will be run from different different machine/server. how to listen from a specific URL? i mean two machine will run from two server. so how front end will detect the actual server, you know if you create a listenData channel how it will connect with middleware that are hosted in a specific domain
Thank you! I personally haven't tried to use Reverb on a separate host yet. However, according to the official Reverb docs, it is possible. I successfully used Reverb with a NextJS front-end and a Laravel back-end but it's on a single server.
Cool, simple and straightforward. I tried several projects and none worked through the network. Only on the server. Like using another machine or over the phone doesn't work. Any tricks to make it work?
@@glennraya Thanks for the feedback! Maybe when you have some free time, you could make a video explaining how to put it into production on a local server. Lay people always wanting to learn from the best. Thanks again and stay focused on helping others!
Thank you! yes, it's a single channel, and listen to multiple events. Tomorrow, I'm going to upload a new video as a follow-up to this, where I'm going to explain how we can use Laravel Reverb when the frontend is separated from the backend, I'll be using NextJS for that example.
nice one boss. easy to deploy din ito? like sa mga configs/env... any tips/advice on the things to consider before deploying (ie: dev server), any issues you encountered so far using this package?
Thank you. Actually kahapon ko lang na try yung Reverb, pero yung deployment sa production should be almost the same sa local, may reverb server and queue workers na naka start, you may need to configure supervisor to restart yung mga process kapag nag reboot ng server, and yung mga deployment tips sa Laravel Broadcasting docs, under deployment may mga tips sila sa server configs.
Hi, I'm not using livewire so I can't tell 😅 to my knowledge people say it's actually easier in livewire. However dispatching an event is just the same: broadcast(...) or event(...) from your controller methods or wherever you need to dispatch the event.
Great content! Was simplicity the reason why you are not using REST for article deletion request ? ie DELETE /users/:userId/articles/:articleId I am thinking that could help use route model minding to ensure the IDs (user and article) are valid
Thanks, 🙏🏼 I didn't use REST to delete the resource because I want to focus on Reverb itself so I can quickly show Reverb's capabilities. This is just a demo of Reverb but of course, when in real-world development, we should use established best practices.
I don't know if you watched the entirety of the video, but this is not a chat app, it's a demonstration of how we can implement real-time functionality in a Laravel app. Of course, the example I made is not meant for production use, but just an example of how we can utilize Reverb in a similar project, including a chat app. I also have a video about a chat app using Reverb. th-cam.com/video/C39uG7PaeDI/w-d-xo.html
@@himanshubelwal-m4l If you're referring to "multi-tenant" apps, I haven't used Reverb yet on a multi-tenant apps, but I'm pretty sure it would work just like in a normal single tenant app.
@@glennraya I have also done one user to one user chats and grops chats using laravel reveb but I am not able to connect with laravel tenant. If anyone can help please help me in creating auth in laravel tenancy 403 and message sending time 419. what error has occurred
Saktong sakto to sa inaaral ko kanina sa work for realtime notif when client request something😂 gamit ko sir laravel + pusher at react/next + pusherjs. Saktong sakto itong video mo ito hinahanap ko yung naka per user po yung notif sa ngayon kasi ginagawa ko parang naka public broadcast lang hindi naka private channel.
@@KingRyanGaming depende po sa requirements ng project. If malaking app na maraming modules and may kasama pang mobile app, better na naka decoupled architecture (separate frontend/backend).
Yes, I'm aware of the Pusher is not defined error, to what I remember, you only need to put the window.Pusher instance in the useEffect hook. If you try to remove pusher, it won't work. I think Echo is using some of Pusher's methods, maybe that's why it is still needed and was included in the docs to be installed.
Excellent job. I really appreciate you using a very real world scenario. It provided context for why this approach is so helpful.
Thank you. I always strive to present real-world use cases in my examples so people can have an idea of where to use them in their projects.
Wow! This saved me some time and I did not know about Reverb. I am using it for a Book project taking Japanese to other languages and allow users to edit the text. I section text into blocks which could be a paragraph or a sentence and users can see which blocks of text in the book are being edited or have a hold because someone already edited. I used Tailwind as well. Thanks for this wonderful video you put out!
Thanks for your kind comment. Good luck on your projects. You may check my other videos related to Laravel Reverb. ☺️🙏
Ang ganda ng explanation kung ganto lang sana mga speakers sa DICT seminars😅
ahaha, salamat po! 😆
@@glennraya Hi, may I ask how did you use SSL to your local website?
@@christiancolewan I am on macOS, and it's very easy to setup local SSL on macOS. I use Laravel Herd for my local dev environment, you can set local SSL from there. If you're on Windows, Herd is now also available for Windows as well.
@@glennraya ohh salamat master
Another Superb Tutorial, Keep it up Bro
@@wormy_coder thank you
Terima kasih mas, sangat membantuku
You're welcome! ☺
Very informative and nicely done. I tried this in my local env. but i cant pass this simple error. I can notice at 8:25 of this video that your console shows the same thing for you as well. Firefox cant establish a connection to wss. I tried both laravel Herd (free) and docker but to no avail. Do you have any guidance for how to resolve this? Thanks in advance
Thanks for the comment, you have to make sure that REVERB_HOST is set your local domain "example.test" and your REVERB_SCHEME is set to https. In some dev environments, some do encounter this issue on Firefox, so far I don't encounter this. Kinda unpredictable, but it should work normally in production.
@@glennraya Thanks for the answer, I already have the env set with the correct data. But i am already at this for 2 days and i slowly lean to giving up :/
If you're developing on Windows but it's working on Webkit browsers (chrome, edge, etc.) it should be fine, other people also have this issue on Firefox on Windows because Firefox seems to have been rejecting local SSL, in production it should be fine. On macOS though, it seems to be ok.
@@JordanJanevski I suggest removing the local SSL and testing it on HTTP only (without SSL), and it should work. I also talked to other people regarding this, and their issue is that the local SSL on Windows seems to be not working on all browsers.
@@glennraya After disabling the SSL in herd, and changing app url and reverb scheme to http, I dont see any differences. I still see the error in the console being for wss.. is windows this bad or is it just me? x.x its the same for both chrome / firefox
Can you please share the vscode customisation settings details? Like theme, font, line height, ...
I have a video dedicated for it: th-cam.com/video/9_I0bySQoCs/w-d-xo.html
But this looks different than vs code used in current video, I like the current video vs code settings.
@@tamilselvan-jas as far as I remembered, I used GitHub's Monaspace font here, and the GitHub Palenight Dark theme.
Thank you ❤❤❤
Thanks a lot for sharing this!
@@rajaasyraf25 you're welcome 🙏☺️
good one bro
great video....
Thank you!
Nice video, what is your vsc theme please
Thanks! The theme is "Github Dark Palenight"
Pretty cool! I understand this is a demo but I think instead of $article->user you should pass the logged in user - right? Because the editor is the user who authorizes the delete, and not article_user.
In this context, `$article->user` represents the article's owner, who initiated the delete. I passed this data to ensure the article also disappears for the user who deleted it. Thanks! 🙏🏼
you are gem man 😎😎😎😎
Thank you so much! 🙏🏼
@@glennraya keep sharing knowledge. we need more guides like you in programming world
@@programmingmindset I'm striving to be consistent in uploading on a regular basis (weekly). Thank you! 🙏🏼
where do you get ID and keys for reverb in the env file?
also, nice tutorial, subscribed to you haha
There's no artisan command to generate that unless you install broadcasting from scratch, but you can set it to whatever string/numeric values you want for as long as it is unique. That's all it requires.
@@glennraya so hindi na need gumawa ng account boss? hindi katulad ng pusher? so random string as long as unique?
@@gamesandlofimucic yes po. Wala ng account bale parang locally hosted yan
@@gamesandlofimucic just run php artisan reverb:install
Thats so cool.😯
@@farhadfarzi3351 thanks 🙂
What do you use for this project? Awesome video by the way!
and also what theme are you using?
Thank you, I used nextUI for some of the UI. It's the Laravel Breeze scaffolding.
@@glennraya what font are you using for this project?
@@JSONFX Github's Monaspace code fonts (Monaspace Neon).
Hey, Its a nice work. what if i host my reverb application as a middleware to send notifications from a server and my frontend will be run from different different machine/server. how to listen from a specific URL? i mean two machine will run from two server. so how front end will detect the actual server, you know if you create a listenData channel how it will connect with middleware that are hosted in a specific domain
Thank you! I personally haven't tried to use Reverb on a separate host yet. However, according to the official Reverb docs, it is possible. I successfully used Reverb with a NextJS front-end and a Laravel back-end but it's on a single server.
Cool, simple and straightforward.
I tried several projects and none worked through the network. Only on the server. Like using another machine or over the phone doesn't work. Any tricks to make it work?
I haven't tried that setup yet, but it should be fairly easy to setup in production servers.
@@glennraya Thanks for the feedback!
Maybe when you have some free time, you could make a video explaining how to put it into production on a local server. Lay people always wanting to learn from the best. Thanks again and stay focused on helping others!
@@TheHenriquesbr Yes, I actually planning the video for deploying Reverb into a production server, a VPS with a domain. Thank you for your feedback! ☺
Very nice explanation 👌 thank you
You used the same channel for both events right?
Thank you! yes, it's a single channel, and listen to multiple events. Tomorrow, I'm going to upload a new video as a follow-up to this, where I'm going to explain how we can use Laravel Reverb when the frontend is separated from the backend, I'll be using NextJS for that example.
@@glennraya great! Thank you 😊
@@glennraya Can we also use this in MEVN stack ? Nodejs Vue Mongo
Which program do you use on terminal and sql ?
I use Warp for the terminal, and TablePlus for my DB client.
nice one boss. easy to deploy din ito? like sa mga configs/env... any tips/advice on the things to consider before deploying (ie: dev server), any issues you encountered so far using this package?
Thank you. Actually kahapon ko lang na try yung Reverb, pero yung deployment sa production should be almost the same sa local, may reverb server and queue workers na naka start, you may need to configure supervisor to restart yung mga process kapag nag reboot ng server, and yung mga deployment tips sa Laravel Broadcasting docs, under deployment may mga tips sila sa server configs.
Hi I'm using livewire how to dispach my event??
Hi, I'm not using livewire so I can't tell 😅 to my knowledge people say it's actually easier in livewire. However dispatching an event is just the same: broadcast(...) or event(...) from your controller methods or wherever you need to dispatch the event.
@@glennraya yes it's normally very easy to dispatch but I have a problem that I don't know where he is from
Great content! Was simplicity the reason why you are not using REST for article deletion request ? ie DELETE /users/:userId/articles/:articleId
I am thinking that could help use route model minding to ensure the IDs (user and article) are valid
Thanks, 🙏🏼 I didn't use REST to delete the resource because I want to focus on Reverb itself so I can quickly show Reverb's capabilities. This is just a demo of Reverb but of course, when in real-world development, we should use established best practices.
are you sure this chat work on laravel tenancy if you know about this how we can connect server each other please help
I don't know if you watched the entirety of the video, but this is not a chat app, it's a demonstration of how we can implement real-time functionality in a Laravel app. Of course, the example I made is not meant for production use, but just an example of how we can utilize Reverb in a similar project, including a chat app. I also have a video about a chat app using Reverb. th-cam.com/video/C39uG7PaeDI/w-d-xo.html
@@glennraya Have you ever used Laravel Reverb with a Laravel tenant?
@@himanshubelwal-m4l If you're referring to "multi-tenant" apps, I haven't used Reverb yet on a multi-tenant apps, but I'm pretty sure it would work just like in a normal single tenant app.
@@glennraya I have also done one user to one user chats and grops chats using laravel reveb but I am not able to connect with laravel tenant. If anyone can help please help me in creating auth in laravel tenancy 403 and message sending time 419. what error has occurred
Kuya gleen upload kana video please 😢
Na busy po sa work haha
Perfect.
Thank you!
Saktong sakto to sa inaaral ko kanina sa work for realtime notif when client request something😂 gamit ko sir laravel + pusher at react/next + pusherjs. Saktong sakto itong video mo ito hinahanap ko yung naka per user po yung notif sa ngayon kasi ginagawa ko parang naka public broadcast lang hindi naka private channel.
Madali po yan promise. Mas matagal ko pa ginawa yung UI para example kaysa doon sa real-time mismo.
Mas gaganda ba system king naka vue or next.js ang front end?
@@KingRyanGaming depende po sa requirements ng project. If malaking app na maraming modules and may kasama pang mobile app, better na naka decoupled architecture (separate frontend/backend).
Pwede sa laravel 10 sir?
Yes pwede po.
it is working, but i had to install pusher js, even i don't need it. otherwise there is an error: ReferenceError: Pusher is not defined
Yes, I'm aware of the Pusher is not defined error, to what I remember, you only need to put the window.Pusher instance in the useEffect hook. If you try to remove pusher, it won't work. I think Echo is using some of Pusher's methods, maybe that's why it is still needed and was included in the docs to be installed.
plz make a video to setup same to same vs code them which you are using now. need same to same i am not alone my most of friends need to this
My VS Code setup? I already made one: th-cam.com/video/9_I0bySQoCs/w-d-xo.html
Unnecessarily bringing react here. plain js would make things more broad and clear
You have a point. However, my goal whenever publishing content like this is to give more practical, realistic examples.
Repeating 5 times 😢
@@aircommander26 You may open an issue in the github repo and explain the issue further from there.
How is that easy bro, just use firebase, 5 lines of code and you have realtime. Thats not easy
Firebase is not suitable for "all" project requirements though.