/laravel-websocket-chatroom

laravel chatroom websocket and tailwind css

Primary LanguageJavaScript

laravel-chatroom-websocket

This is an online chat room sample project in Laravel using websockets.

Installation and Setup

Clone this repository by running

 git clone https://github.com/sinakhaghani/laravel-websocket-chatroom.git

Install the packages by running the composer install command

 composer install

Install JavaScript dependencies and install tailwind css in your project

 npm install

Set your database credentials in the .env file

Run the migrations

 php artisan migrate

Pusher

Set the Pusher app credentials in the .env as follows

PUSHER_APP_ID=your_app_id
PUSHER_APP_KEY=your_app_key
PUSHER_APP_SECRET=your_app_secret
PUSHER_APP_CLUSTER=mt1

Set your PUSHER_APP_KEY in resources/js/bootstrap.js file

window.Echo = new Echo({
    broadcaster: 'pusher',
    key: 'your_app_key',
    wsHost: window.location.hostname,
    wsPort: 6001,
    forceTLS: false,
    disableStats: true,
});

Set the BROADCAST_DRIVER variable in the .env file to pusher

BROADCAST_DRIVER=pusher

Run the laravel

 php artisan serve

Run the websockets

 php artisan websocket:serve

Go to the following url and connect websockets

localhost:8000/laravel-websockets

Now the project is ready to use

localhost:8000/rooms