Laravel Reverb: The Easiest Way to Add Real-Time Magic to Your App

Поділитися
Вставка
  • Опубліковано 2 лис 2024

КОМЕНТАРІ • 88

  • @hamburger--fries
    @hamburger--fries 4 місяці тому +4

    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!

    • @glennraya
      @glennraya  4 місяці тому +1

      Thanks for your kind comment. Good luck on your projects. You may check my other videos related to Laravel Reverb. ☺️🙏

  • @mcylinder
    @mcylinder 3 місяці тому +4

    Excellent job. I really appreciate you using a very real world scenario. It provided context for why this approach is so helpful.

    • @glennraya
      @glennraya  3 місяці тому +1

      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.

  • @christiancolewan
    @christiancolewan 4 місяці тому +3

    Ang ganda ng explanation kung ganto lang sana mga speakers sa DICT seminars😅

    • @glennraya
      @glennraya  4 місяці тому

      ahaha, salamat po! 😆

    • @christiancolewan
      @christiancolewan 2 місяці тому +1

      @@glennraya Hi, may I ask how did you use SSL to your local website?

    • @glennraya
      @glennraya  2 місяці тому +1

      @@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.

    • @christiancolewan
      @christiancolewan 2 місяці тому

      @@glennraya ohh salamat master

  • @wormy_coder
    @wormy_coder Місяць тому

    Another Superb Tutorial, Keep it up Bro

    • @glennraya
      @glennraya  Місяць тому

      @@wormy_coder thank you

  • @jokokentir666
    @jokokentir666 3 місяці тому +1

    Terima kasih mas, sangat membantuku

    • @glennraya
      @glennraya  3 місяці тому

      You're welcome! ☺

  • @rajaasyraf25
    @rajaasyraf25 4 місяці тому

    Thanks a lot for sharing this!

    • @glennraya
      @glennraya  4 місяці тому

      @@rajaasyraf25 you're welcome 🙏☺️

  • @ElephantBay-nv5jn
    @ElephantBay-nv5jn 5 місяців тому +1

    good one bro

  • @mdismailhossain2219
    @mdismailhossain2219 2 місяці тому

    great video....

  • @farhadfarzi3351
    @farhadfarzi3351 4 місяці тому

    Thats so cool.😯

    • @glennraya
      @glennraya  4 місяці тому

      @@farhadfarzi3351 thanks 🙂

  • @JSONFX
    @JSONFX 4 місяці тому +1

    What do you use for this project? Awesome video by the way!

    • @JSONFX
      @JSONFX 4 місяці тому

      and also what theme are you using?

    • @glennraya
      @glennraya  4 місяці тому +1

      Thank you, I used nextUI for some of the UI. It's the Laravel Breeze scaffolding.

    • @JSONFX
      @JSONFX 4 місяці тому +1

      @@glennraya what font are you using for this project?

    • @glennraya
      @glennraya  4 місяці тому

      @@JSONFX Github's Monaspace code fonts (Monaspace Neon).

  • @CaneZyle
    @CaneZyle 5 місяців тому +1

    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?

    • @glennraya
      @glennraya  5 місяців тому +1

      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.

  • @hassamulhaq7762
    @hassamulhaq7762 3 місяці тому

    Perfect.

  • @iqbalhossain9299
    @iqbalhossain9299 18 днів тому

    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

    • @glennraya
      @glennraya  18 днів тому

      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.

  • @ivordotdev
    @ivordotdev Місяць тому

    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.

    • @glennraya
      @glennraya  Місяць тому

      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! 🙏🏼

  • @gamesandlofimucic
    @gamesandlofimucic 4 місяці тому +1

    where do you get ID and keys for reverb in the env file?
    also, nice tutorial, subscribed to you haha

    • @glennraya
      @glennraya  4 місяці тому

      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.

    • @gamesandlofimucic
      @gamesandlofimucic 4 місяці тому +1

      @@glennraya so hindi na need gumawa ng account boss? hindi katulad ng pusher? so random string as long as unique?

    • @glennraya
      @glennraya  4 місяці тому

      @@gamesandlofimucic yes po. Wala ng account bale parang locally hosted yan

    • @viraliz6334
      @viraliz6334 Місяць тому

      @@gamesandlofimucic just run php artisan reverb:install

  • @anthonyhidalgo3391
    @anthonyhidalgo3391 4 місяці тому +1

    Nice video, what is your vsc theme please

    • @glennraya
      @glennraya  4 місяці тому

      Thanks! The theme is "Github Dark Palenight"

  • @tasneemwahdan3618
    @tasneemwahdan3618 5 місяців тому

    Very nice explanation 👌 thank you
    You used the same channel for both events right?

    • @glennraya
      @glennraya  5 місяців тому +1

      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.

    • @tasneemwahdan3618
      @tasneemwahdan3618 5 місяців тому

      @@glennraya great! Thank you 😊

    • @ThanHtutZaw3
      @ThanHtutZaw3 4 місяці тому

      @@glennraya Can we also use this in MEVN stack ? Nodejs Vue Mongo

  • @programmingmindset
    @programmingmindset 3 місяці тому

    you are gem man 😎😎😎😎

    • @glennraya
      @glennraya  3 місяці тому

      Thank you so much! 🙏🏼

    • @programmingmindset
      @programmingmindset 3 місяці тому

      @@glennraya keep sharing knowledge. we need more guides like you in programming world

    • @glennraya
      @glennraya  3 місяці тому

      @@programmingmindset I'm striving to be consistent in uploading on a regular basis (weekly). Thank you! 🙏🏼

  • @JordanJanevski
    @JordanJanevski 4 місяці тому +1

    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

    • @glennraya
      @glennraya  4 місяці тому +1

      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.

    • @JordanJanevski
      @JordanJanevski 4 місяці тому

      @@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 :/

    • @glennraya
      @glennraya  4 місяці тому

      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.

    • @glennraya
      @glennraya  4 місяці тому

      @@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.

    • @JordanJanevski
      @JordanJanevski 4 місяці тому

      @@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

  • @TheHenriquesbr
    @TheHenriquesbr 4 місяці тому

    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
      @glennraya  4 місяці тому

      I haven't tried that setup yet, but it should be fairly easy to setup in production servers.

    • @TheHenriquesbr
      @TheHenriquesbr 4 місяці тому +1

      @@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!

    • @glennraya
      @glennraya  4 місяці тому

      @@TheHenriquesbr Yes, I actually planning the video for deploying Reverb into a production server, a VPS with a domain. Thank you for your feedback! ☺

  • @saffetoge
    @saffetoge 2 місяці тому

    Which program do you use on terminal and sql ?

    • @glennraya
      @glennraya  2 місяці тому

      I use Warp for the terminal, and TablePlus for my DB client.

  • @hamzabarry7880
    @hamzabarry7880 4 місяці тому +1

    Hi I'm using livewire how to dispach my event??

    • @glennraya
      @glennraya  4 місяці тому +1

      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.

    • @hamzabarry7880
      @hamzabarry7880 4 місяці тому

      @@glennraya yes it's normally very easy to dispatch but I have a problem that I don't know where he is from

  • @lotkutv2392
    @lotkutv2392 5 місяців тому +1

    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.

    • @glennraya
      @glennraya  5 місяців тому

      Madali po yan promise. Mas matagal ko pa ginawa yung UI para example kaysa doon sa real-time mismo.

    • @KingRyanGaming
      @KingRyanGaming 5 місяців тому

      Mas gaganda ba system king naka vue or next.js ang front end?

    • @glennraya
      @glennraya  5 місяців тому

      @@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).

  • @himanshubelwal-m4l
    @himanshubelwal-m4l 28 днів тому

    are you sure this chat work on laravel tenancy if you know about this how we can connect server each other please help

    • @glennraya
      @glennraya  28 днів тому

      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. ua-cam.com/video/C39uG7PaeDI/v-deo.html

    • @himanshubelwal-m4l
      @himanshubelwal-m4l 28 днів тому

      @@glennraya Have you ever used Laravel Reverb with a Laravel tenant?

    • @glennraya
      @glennraya  28 днів тому +1

      @@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.

    • @himanshubelwal-m4l
      @himanshubelwal-m4l 28 днів тому

      @@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

  • @yamato23488
    @yamato23488 4 місяці тому +1

    Pwede sa laravel 10 sir?

  • @optimusdebugger9638
    @optimusdebugger9638 3 місяці тому

    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

    • @glennraya
      @glennraya  3 місяці тому

      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.

  • @Плененныйкустами
    @Плененныйкустами 4 місяці тому

    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

    • @glennraya
      @glennraya  4 місяці тому

      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.

  • @user-xg4rm3ww3o
    @user-xg4rm3ww3o Місяць тому

    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

    • @glennraya
      @glennraya  Місяць тому

      My VS Code setup? I already made one: ua-cam.com/video/9_I0bySQoCs/v-deo.html

  • @xzev7445
    @xzev7445 Місяць тому

    How is that easy bro, just use firebase, 5 lines of code and you have realtime. Thats not easy

    • @glennraya
      @glennraya  Місяць тому

      Firebase is not suitable for "all" project requirements though.