Real-time Applications with Laravel Reverb and Event Broadcasting

For years, adding real-time capabilities to a Laravel app meant relying on third-party services like Pusher or complex NodeJS socket.io implementations.

With Laravel 11, the ecosystem introduced Laravel Reverb, a first-party, insanely fast, and scalable WebSocket server written entirely in PHP.

1. Setting up Reverb

Installing Reverb is incredibly simple, as it integrates directly with Laravel’s existing event broadcasting system.

php artisan install:broadcasting

This single command configures your broadcasting.php file, installs the Reverb package, and publishes the necessary configuration.

You can then start the Reverb server locally:

php artisan reverb:start

2. Broadcasting Events

In Laravel, a real-time update is triggered by firing an Event that implements the ShouldBroadcast interface.

use IlluminateContractsBroadcastingShouldBroadcast;

class OrderShipped implements ShouldBroadcast
{
    use Dispatchable, InteractsWithSockets, SerializesModels;

    public $order;

    public function __construct(Order $order)
    {
        $this->order = $order;
    }

    public function broadcastOn()
    {
        // Broadcasting on a private channel specific to the user
        return new PrivateChannel('orders.'.$this->order->user_id);
    }
}

When you call event(new OrderShipped($order)); anywhere in your application, Laravel automatically serializes the event data and pushes it to your Reverb WebSocket server.

3. Listening on the Frontend with Echo

To listen to these events on your frontend (whether you use Vue, React, or vanilla JS), you use Laravel Echo.

Echo connects to Reverb seamlessly:

import Echo from 'laravel-echo';
import Pusher from 'pusher-js';

window.Pusher = Pusher;

window.Echo = new Echo({
    broadcaster: 'reverb',
    key: import.meta.env.VITE_REVERB_APP_KEY,
    wsHost: import.meta.env.VITE_REVERB_HOST,
    wsPort: import.meta.env.VITE_REVERB_PORT,
    forceTLS: false,
});

To listen to the event we broadcasted earlier:

window.Echo.private(`orders.${userId}`)
    .listen('OrderShipped', (e) => {
        console.log("Your order was shipped!", e.order);
        // Show a notification toast to the user
    });

4. Presence Channels

If you are building a chat application or a collaborative document editor, you need Presence Channels. These are private channels that not only allow users to receive messages but also allow them to see who else is currently subscribed to the channel.

window.Echo.join(`chat.${roomId}`)
    .here((users) => {
        console.log("Currently in the room:", users);
    })
    .joining((user) => {
        console.log(user.name + " joined.");
    })
    .leaving((user) => {
        console.log(user.name + " left.");
    });

By leveraging Reverb and Echo, building real-time dashboards, live chat, and instant notifications is now a native, first-class experience in Laravel.