https://github.com/manavi-arora/buzzchat-mern

BuzzChat is a MERN-stack real-time chat platform with one-on-one & group messaging, image sharing, voice & video calls (powered by Agora), Google authentication, friend suggestions and updates, and status updates.
https://github.com/manavi-arora/buzzchat-mern

agora-webrtc daisyui expressjs html-css-javascript jwt-authentication mongodb mongoose nodejs reactjs socket-io tailwind-css

Last synced: 3 months ago
JSON representation

Host: GitHub
URL: https://github.com/manavi-arora/buzzchat-mern
Owner: Manavi-Arora
Created: 2025-01-06T17:52:16.000Z (over 1 year ago)
Default Branch: main
Last Pushed: 2025-02-08T14:30:38.000Z (over 1 year ago)
Last Synced: 2025-02-08T15:28:48.410Z (over 1 year ago)
Topics: agora-webrtc, daisyui, expressjs, html-css-javascript, jwt-authentication, mongodb, mongoose, nodejs, reactjs, socket-io, tailwind-css
Language: JavaScript
Homepage: https://buzzchat-mern.onrender.com/
Size: 7.92 MB
Stars: 1
Watchers: 1
Forks: 0
Open Issues: 0
Metadata Files:
- Readme: README.md

Awesome Lists containing this project

README

# 💬 BuzzChat – Real-Time Chat & Video Calling 🚀

BuzzChat is a *MERN-stack* real-time chat platform with one-on-one & group messaging, image sharing, voice & video calls (powered by Agora), Google authentication, friend suggestions and updates, and status updates. Designed for seamless communication, it ensures *secure, fast, and interactive* conversations.

---

## 🌟 Features

### 🔹 *Real-Time One-on-One & Group Chat*
✅ *Instant Messaging* – Send and receive messages *in real time*.
✅ *Typing Indicators* – Know when someone is typing.
✅ *Message Notifications* – Get instant alerts for new messages.
✅ *Message History* – Search past conversations easily.
✅ *Group Chats* – Create and manage groups, add/remove members, and send messages.

### 🔹 *Text & Image Messaging*
✅ *Text Chat* – Quick and efficient message delivery.
✅ *Image Sharing* – Send and receive images instantly.
✅ *Multimedia Support* – Inline image previews for a richer experience.

### 🔹 *Voice & Video Calling (Agora Integration)*
✅ *One-on-One Video and Voice Calls* – High-quality, real-time video and voice chat.
✅ *Mute & Cancel Call* – Manage audio/video settings easily.

### 🔹 *User Authentication & Security*
✅ *Google Authentication* – Sign in quickly using Google.
✅ *Secure Sign-up/Login* – Authenticate via *email/password*.
✅ *Session Management* – Stay logged in across devices.
✅ *JWT-Based Authentication* – Secure login system.

### 🔹 *Group Messaging & Status Updates*
✅ *Create & Manage Groups* – Add/remove participants easily.
✅ *Status Updates* – Share text/image status updates visible to friends.

### 🔹 *User Profile Management and Friend Suggestions*
✅ *Profile Picture Update* – Upload and change profile pictures.
✅ *Edit Profile* – Update username, bio, and other personal details.
✅ *Friend Suggestion Management – View, send, and manage friend requests, adjust suggestion algorithms, hide/block suggestions, and add or remove friends from available users

### 🔹 *Settings & Customization*
✅ *Change Theme* – Switch between *dark & light* modes.
✅ *Notification Preferences* – Enable/disable message alerts.

---

## 🛠 Tech Stack

### *Frontend:*
- *React.js (Vite)* – Fast UI rendering.
- *Tailwind CSS* – Modern & responsive styling.
- *Socket.io* – Real-time messaging.
- *Zustand* – Efficient state management.

### *Backend:*
- *Node.js & Express.js* – API server.
- *MongoDB* – Database for storing messages, users, and chats.
- *JWT (JSON Web Tokens)* – Secure authentication.
- *Socket.io* – Real-time communication.
- *Agora SDK* – High-quality voice & video calls.
- *Google OAuth* – Secure Google authentication.

### *Cloud Storage & Other Services:*
- *Cloudinary* – Store and manage images.
- *WebRTC (via Agora)* – Video calling.

---

## 🚀 Getting Started

### 1️⃣ *Clone the Repository*
```
git clone https://github.com/Manavi-Arora/BuzzChat-MERN.git
cd BuzzChat-MERN
```

### 2️⃣ *Install Dependencies*
```
npm install
```

### 3️⃣ *Set Up Environment Variables*
Create a *.env* file in the server folder and add:
```
MONGO_URI=
JWT_SECRET=
CLOUDINARY_CLOUD_NAME=
CLOUDINARY_API_KEY=
CLOUDINARY_API_SECRET=
AGORA_APP_ID=
AGORA_APP_CERTIFICATE=
GOOGLE_CLIENT_ID=
GOOGLE_CLIENT_SECRET=
PORT=5000
NODE_ENV=development
```

### 4️⃣ *Run the Application*
```
npm start
```

---

## 🎥 Visual Representation