Laravel Internal Live-Chat with Reverb and Livewire

A live-chat for marketplace projects between a buyer and a seller, in this case - mini job-board with chat between a client and a developer, about a particular project.

This project is based on Laravel, Reverb and Livewire 3.

Feel free to pick the parts that you actually need in your projects.

How to install

Clone the repository with git clone
Copy the .env.example file to .env and edit database credentials there
Run composer install
Run php artisan key:generate
Run php artisan storage:link
Run php artisan migrate --seed (it has some seeded data for your testing)
Run npm ci and npm run build
Run php artisan reverb:start to start Laravel Reverb server
Launch the main URL /. Log in with credentials for a user to desire:
- Client: [email protected] / password
- Developer: [email protected] / password
That's it.

Screenshots

How It Works

Broadcasting Configuration

For real-time messaging to work, your .env file must be configured with the following broadcasting settings:

BROADCAST_CONNECTION=reverb
 
REVERB_APP_ID=your_app_id
REVERB_APP_KEY=your_app_key
REVERB_APP_SECRET=your_app_secret
REVERB_HOST=127.0.0.1
REVERB_PORT=8080
REVERB_SCHEME=http
 
VITE_REVERB_APP_KEY="${REVERB_APP_KEY}"
VITE_REVERB_HOST="${REVERB_HOST}"
VITE_REVERB_PORT="${REVERB_PORT}"
VITE_REVERB_SCHEME="${REVERB_SCHEME}"

Application Architecture

The chat system is built around a ChatController that handles chat creation and display, with real-time messaging powered by Livewire components and broadcasting.

app/Http/Controllers/ChatController.php:

class ChatController extends Controller
{
    public function store(Request $request, Job $job): RedirectResponse
    {
        // Only developers can create chats
        if (! auth()->user()->isDeveloper()) {
            abort(403, 'Only developers can chat with clients.');
        }
 
        $chat = Chat::firstOrCreate([
            'job_id'       => $job->id,
            'developer_id' => auth()->id(),
        ]);
 
        return redirect()->route('chats.show', $chat);
    }
 
    public function show(Chat $chat): View
    {
        // Ensure user has access to this chat
        if (
            (! auth()->user()->isClient() && $chat->developer_id !== auth()->id()) ||
            (! auth()->user()->isDeveloper() && $chat->job->client_id !== auth()->id())
        ) {
            abort(403);
        }
 
        $chat->load('job', 'developer', 'job.client');
 
        return view('chats.show', compact('chat'));
    }
}

The chat interface uses three Livewire...

Want to get the access to GitHub repository?

Become a Premium Member for $129/year or $29/month