How to Implement Real-Time Notifications with Laravel Reverb

What is Laravel Reverb?

Laravel Reverb is a first-party WebSocket server that enables real-time features without third-party services.

Step 1: Install Reverb

composer require laravel/reverb
php artisan reverb:install

Step 2: Configure Environment

# .env
BROADCAST_DRIVER=reverb
REVERB_APP_ID=my-app
REVERB_APP_KEY=my-key
REVERB_APP_SECRET=my-secret
REVERB_HOST=localhost
REVERB_PORT=8080

Step 3: Create Notification Event

<?php

namespace App\Events;

use Illuminate\Broadcasting\Channel;
use Illuminate\Contracts\Broadcasting\ShouldBroadcast;

class NewNotification implements ShouldBroadcast
{
    public function __construct(
        public string $message,
        public int $userId
    ) {}

    public function broadcastOn(): Channel
    {
        return new Channel("user.{$this->userId}");
    }

    public function broadcastAs(): string
    {
        return 'notification';
    }
}

Step 4: Dispatch Notification

// In your controller
event(new NewNotification('You have a new message!', $user->id));

Step 5: Frontend Setup (Vue/React)

npm install laravel-echo pusher-js

// echo.js
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,
    enabledTransports: ['ws', 'wss'],
});

// Listen for notifications
Echo.channel(`user.${userId}`)
    .listen('.notification', (e) => {
        alert(e.message);
    });

Step 6: Run Reverb Server

php artisan reverb:start

Now your users receive instant notifications!