This is a simple chat application built with Laravel on the backend, Larvel Reverb for real-time communication, and Vue.js for the frontend.
Note: This project is currently under development and may not be production-ready.
Before you begin, ensure you have the following installed:
- PHP (>=8.2)
- Composer
- Node.js (>=18.x)
- NPM or Yarn or Bun
- Laravel (>=11.x)
- Laravel Reverb
-
Clone the repository:
git clone https://github.com/your-username/your-chat-app.git
-
Navigate into the project directory:
cd your-chat-app
-
Install PHP dependencies:
cd backend composer install
-
Install JavaScript dependencies:
cd frontend npm install # or yarn install #or bun install
-
Copy the
.env.example
file to.env
and update the database and Pusher configuration:cp .env.example .env
-
Generate application key:
php artisan key:generate
-
Run migrations to create the necessary database tables:
php artisan migrate
-
If you want to use Pusher you should edit tour '.env' file:
PUSHER_APP_ID=your-pusher-app-id PUSHER_APP_KEY=your-pusher-app-key PUSHER_APP_SECRET=your-pusher-app-secret PUSHER_APP_CLUSTER=your-pusher-app-cluster
And change client side configurations
import Echo from 'laravel-echo'; window.Pusher = require('pusher-js'); window.Echo = new Echo({ broadcaster: 'pusher', key: import.meta.env.VITE_PUSHER_APP_KEY, cluster: import.meta.env.VITE_PUSHER_APP_CLUSTER, forceTLS: true });
-
If you would like to broadcast your event using the sync queue instead of the default queue driver, you can implement the ShouldBroadcastNow interface instead of ShouldBroadcast. Otherwise you should change QUEUE_CONNECTION to 'sync' in .env file.But ist not recommend. Because this can breake whole queue system.
-
Serve the backend application:
php artisan serve
-
Start Reverb service
php artisan reverb:start
-
Start the frontend application
npm run dev #or bun dev
-
Visit
http://localhost:5173
in your browser to access the chat application.
Contributions are welcome! Feel free to open issues or pull requests.