A modern WhatsApp Clone built using Next.js, Clerk, Convex, and ZEGOCLOUD. Includes features such as secure authentication, real-time messaging, video/group calls, dark/light themes, and responsive UI.
⚡ This project showcases an advanced real-time chat system with cloud-native backend and UI integrations.
- 🔐 Authentication via Clerk.dev
- 💬 Real-time messaging powered by Convex
- 📞 1:1 and group video calls with ZEGOCLOUD
- 🎨 Light/Dark theme toggle
- 👥 Group management (kick/ban users)
- 🧑💼 User profile updates (avatar, bio, etc.)
- 📩 Webhooks for real-time presence and notifications
- 📱 Mobile-first responsive UI
| Tech | Role |
|---|---|
| Next.js | Frontend / SSR |
| React.js | UI layer |
| Clerk | Authentication & sessions |
| Convex | Serverless backend logic |
| ZEGOCLOUD | Video call SDK |
| Tailwind CSS | Styling |
| DaisyUI | UI components |
| Radix UI | Accessibility-first UI |
| Webhooks | Real-time syncing |
- Node.js (v18+)
- Convex CLI
npx convex devnpm installCreate a .env.local file in the root directory:
CONVEX_DEPLOYMENT=dev:friendly-lion-123
NEXT_PUBLIC_CONVEX_URL=https://friendly-lion-123.convex.cloud
NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=pk_test_your_publishable_key
CLERK_SECRET_KEY=sk_test_your_secret_key
ZEGO_APP_ID=123456789
ZEGO_SERVER_SECRET=your_zego_server_secretnpm run devThen open http://localhost:3000 to view it in your browser.
| 🖼️ Feature | Image |
|---|---|
| Main Page (Light) | |
| Main Page (Dark) | |
| Group Video Call | |
| Profile Page | |
| Group Members | |
| Emoji Bar |
- 🍴 Fork this repo
- 🌿 Create your feature branch:
git checkout -b feature/feature-name - 💾 Commit your changes:
git commit -m 'Add feature' - 📤 Push to the branch:
git push origin feature/feature-name - 🔁 Open a pull request
We welcome contributions of all kinds!
Licensed under the MIT License.
See LICENSE for more information.
Project Maintainer: @kgnio