This is a simple video call and chat application using WebRTC and Socket.io.
- WebRTC
- Socket.io
- Next.js
- Node.js
- Express
- bun runtime
- Node.js (v14 or higher)
- bun runtime (1.1.0 or higher)
-
Clone the repository
https://github.com/shu-vro/video-audio-chat.git cd video-audio-chat
-
Install the dependencies. NB: this project used bun as the package manager.
cd server bun i cd ../client bun i
-
Make a file named
.env.local
in the client directory and add the following:NEXT_PUBLIC_SERVER_URL=http://localhost:3001
-
Make a file named
.env.local
in the server directory and add the following:CLIENT_URL=http://localhost:3000 NODE_ENV="development"`
-
Start the server
cd server bun run dev # or bun start if don't want to use nodemon # Then create a new terminal and navigate to the client directory cd client bun run dev
In case You want to see the production build, you can run the following commands:
cd server bun run start # Then create a new terminal and navigate to the client directory cd client bun run build bun run start
-
Open your browser and navigate to
http://localhost:3000
- If you encounter issues with WebRTC, ensure that your server is running with SSL enabled.
- Check the browser console for any error messages and follow the suggested solutions.
-
This code can be hosted anywhere, but it is recommended to use a server with SSL enabled. As WebRTC requires a secure connection to work properly. You can use Render to host the server and Vercel to host the client.
-
This project is a simple implementation of WebRTC and Socket.io. It is not recommended to use this code in production as it lacks many features like authentication, error handling, etc.
-
If you want to deploy this project to production, you can use the following steps:
- Deploy the server to Render or Heroku
- Deploy the client to Vercel or Netlify
- Update the
.env
file in the client directory with the server URL
-
If you want to contribute to this project, you can create a pull request with your changes. I will review it and merge it if it is good. For additional information, head to CONTRIBUTING.md