Skip to content

Commit ca7ec77

Browse files
committed
update readme
1 parent 4cf58c2 commit ca7ec77

File tree

1 file changed

+77
-58
lines changed

1 file changed

+77
-58
lines changed

README.md

+77-58
Original file line numberDiff line numberDiff line change
@@ -1,85 +1,100 @@
11
# Laravel WebRTC with Reverb & Echo
22

3-
This project integrates WebRTC with Laravel Reverb and Laravel Echo, enabling real-time peer-to-peer communication using Laravels native WebSocket capabilities.
3+
This project integrates **WebRTC** with **Laravel Reverb** and **Laravel Echo**, enabling real-time peer-to-peer communication using Laravel's native WebSocket capabilities.
44

55
## Features
6-
• Real-Time Communication: Uses WebRTC for live audio and video calls.
7-
• WebSockets with Laravel Reverb: Provides scalable and low-latency signaling for WebRTC.
8-
• Laravel Echo Integration: Handles WebSocket events seamlessly.
9-
• Vue.js Frontend: A dynamic and interactive UI built with Vue.js.
10-
• Self-Hosted WebSocket Server: No need for third-party WebSocket services.
11-
12-
## Prerequisites
13-
• PHP 8+
14-
• Laravel 10+
15-
• Composer
16-
• Node.js & npm
17-
• SQLite, MySQL, or PostgreSQL
18-
19-
Installation
20-
1. Clone the Repository:
21-
22-
git clone https://github.com/mastashake08/laravel-webrtc.git
23-
cd laravel-webrtc
246

7+
- **Real-Time Communication**: Uses **WebRTC** for live audio and video calls.
8+
- **WebSockets with Laravel Reverb**: Provides scalable and low-latency signaling for WebRTC.
9+
- **Laravel Echo Integration**: Handles WebSocket events seamlessly.
10+
- **Vue.js Frontend**: A dynamic and interactive UI built with Vue.js.
11+
- **Self-Hosted WebSocket Server**: No need for third-party WebSocket services.
2512

26-
2. Install Dependencies:
27-
28-
composer install
29-
npm install
13+
## Prerequisites
3014

15+
- **PHP 8+**
16+
- **Laravel 10+**
17+
- **Composer**
18+
- **Node.js & npm**
19+
- **SQLite, MySQL, or PostgreSQL**
3120

32-
3. Environment Configuration:
33-
• Duplicate .env.example and rename it to .env.
34-
• Update your database settings.
35-
• Set the WebSockets connection driver:
21+
## Installation
3622

37-
BROADCAST_DRIVER=pusher
38-
PUSHER_APP_ID=reverb
39-
PUSHER_APP_KEY=reverb
40-
PUSHER_APP_SECRET=reverb
23+
1. **Clone the Repository**:
4124

25+
```bash
26+
git clone https://github.com/mastashake08/laravel-webrtc.git
27+
cd laravel-webrtc
28+
```
4229

43-
• Generate an application key:
30+
2. **Install Dependencies**:
4431

45-
php artisan key:generate
32+
```bash
33+
composer install
34+
npm install
35+
```
4636

37+
3. **Environment Configuration**:
4738

48-
4. Run Database Migrations:
39+
- Duplicate `.env.example` and rename it to `.env`.
40+
- Update your database settings.
41+
- Set the WebSockets connection driver:
4942

50-
php artisan migrate
43+
```ini
44+
BROADCAST_DRIVER=pusher
45+
PUSHER_APP_ID=reverb
46+
PUSHER_APP_KEY=reverb
47+
PUSHER_APP_SECRET=reverb
48+
```
5149

50+
- Generate an application key:
5251

53-
5. Start Laravel Reverb (WebSocket Server):
52+
```bash
53+
php artisan key:generate
54+
```
5455

55-
php artisan reverb:start
56+
4. **Run Database Migrations**:
5657

58+
```bash
59+
php artisan migrate
60+
```
5761

58-
6. Start the Laravel Application:
62+
5. **Start Laravel Reverb (WebSocket Server)**:
5963

60-
php artisan serve
64+
```bash
65+
php artisan reverb:start
66+
```
6167

68+
6. **Start the Laravel Application**:
6269

63-
7. Compile Frontend Assets:
70+
```bash
71+
php artisan serve
72+
```
6473

65-
npm run dev
74+
7. **Compile Frontend Assets**:
6675

67-
Or for production:
76+
```bash
77+
npm run dev
78+
```
6879

69-
npm run build
80+
Or for production:
7081

82+
```bash
83+
npm run build
84+
```
7185

86+
## WebRTC Signaling Flow
7287

73-
WebRTC Signaling Flow
74-
1. User joins a call → Laravel Echo broadcasts an event via Reverb.
75-
2. New peer detected → WebRTC initiates a peer-to-peer connection.
76-
3. ICE Candidates exchanged → STUN/TURN servers handle NAT traversal.
77-
4. Media streams established → Users can see and hear each other.
88+
1. **User joins a call** → Laravel Echo broadcasts an event via Reverb.
89+
2. **New peer detected** → WebRTC initiates a peer-to-peer connection.
90+
3. **ICE Candidates exchanged** → STUN/TURN servers handle NAT traversal.
91+
4. **Media streams established** → Users can see and hear each other.
7892

79-
Configuration for Laravel Echo
93+
## Configuration for Laravel Echo
8094

81-
Your resources/js/bootstrap.js should have the following:
95+
Your `resources/js/bootstrap.js` should have the following:
8296

97+
```javascript
8398
import Echo from 'laravel-echo';
8499

85100
window.Pusher = require('pusher-js');
@@ -92,17 +107,21 @@ window.Echo = new Echo({
92107
forceTLS: false,
93108
disableStats: true,
94109
});
110+
```
95111

96-
Usage
97-
1. Open two different browser windows (or devices).
98-
2. Start a call and invite the other participant.
99-
3. Laravel Reverb will handle WebSocket signaling.
100-
4. WebRTC will establish the peer-to-peer connection.
112+
## Usage
101113

102-
Contributing
114+
1. Open two different browser windows (or devices).
115+
2. Start a call and invite the other participant.
116+
3. Laravel Reverb will handle WebSocket signaling.
117+
4. WebRTC will establish the peer-to-peer connection.
118+
119+
## Contributing
103120

104121
Contributions are welcome! Please fork the repo and submit a pull request.
105122

106-
License
123+
## License
124+
125+
This project is open-source under the [MIT License](LICENSE).
107126

108-
This project is open-source under the MIT License.
127+
---

0 commit comments

Comments
 (0)