Playing
03. Setting up broadcasting
Episodes
01. Introduction
02. Realtime Basics with Nuxt and Laravel
03. Private channels
04. Broadcasting to others
Transcript
00:00
Next up, we're going to get broadcasting functionality installed within our API. So head over to the API project. And the first thing that we're going to do is use PHP Artisan to install our broadcasting functionality. So let's go ahead and run this command.
00:15
And we'll be asked if we'd like to install Laravel Reverb. That's what we're using for this course. You can change this over and it would work in more or less the same way. If you were using a third party service like Pusher,
00:26
you're just going to need to tweak over some of the configuration. OK, let's go ahead and install Laravel Reverb. And once that's done, it's going to ask us if we want to install the node dependencies required for broadcasting.
00:39
Now, in our case, because we're working with an API, there's no need for that because all of the node dependencies like Laravel Echo and Pusher are all going to be installed on the client. So normally, if we were working with Laravel, we would say yes here.
00:52
That would create an echo instance for us in our JavaScript files. But we don't need to do that for our API. So let's go ahead and hear no. OK, so now that we've done this, let's take a look around our Laravel app
01:03
and actually see what's happened here. So the first thing you'll notice is that over in the environment file, let's just check this out first. The broadcasting connection here will have been set to reverb automatically.
01:15
If we go over to our reverb stuff just a little bit further down our environment file, you can see that this has created some sensible defaults for us. Now, we don't actually need to change anything over here unless we're deploying this to production.
01:29
So we have a reverb app key, which is going to be really important for the client. We have the host and the port, which is also going to be important for the client. So we'll be using these values over on the client to connect to the reverb instance that we're running.
01:44
We don't need to worry about the secret because we're going to be triggering real-time events from our backend, our API via an HTTP request to one of the endpoints in our API. That will use the secret to broadcast to our reverb server.
01:58
And our client will use the reverb key and the host and port to go ahead and pick this up, probably the app ID as well. OK, so now that this is working, let's go ahead and run our reverb server. So we're going to go ahead and run php artisan reverb start.
02:15
Now, really importantly, along the way, if you're following this, you might want to use the debug option if you don't see any of your events coming through. So I'm going to go ahead and run with debug just in case. OK, so now that we've done this, we've got a reverb server running,
02:30
which we're going to want to leave running and we can create a new tab to run any other commands. What we can now do is start to connect up on our client to the reverb server using these credentials
02:42
and start to receive events from our server. So remember, our API is responsible for pushing any events to our reverb server and our client is responsible for listening to them events. Let's go ahead and get Laravel Echo set up within our Nuxt app.
12 episodes•1 hr 2 mins•8 months ago
Overview
Using Reverb and Laravel Echo, let’s add real-time broadcasting to a Nuxt SPA, driven by Laravel.
We’ll start with the basics of public channels without authorization. Once we’re set up and able to broadcast to all clients perfectly, we’ll dive into authentication and authorizing private channels by modifying how Laravel Echo authorizes with our API.
By the end of the course, you’ll have everything you need to start adding real-time broadcasting to your Nuxt/Laravel applications.
Alex Garrett-Smith
Hey, I'm the founder of Codecourse!
Episode discussion
No comments, yet. Be the first!