https://github.com/vedant-io/chatter
A chat application where one can have real time conversation with someone on the website and its made possible using MERN stack and socket.io
https://github.com/vedant-io/chatter
chat-application javascript mern-stack socket-io
Last synced: about 2 months ago
JSON representation
A chat application where one can have real time conversation with someone on the website and its made possible using MERN stack and socket.io
- Host: GitHub
- URL: https://github.com/vedant-io/chatter
- Owner: vedant-io
- Created: 2025-01-09T17:16:24.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2025-01-28T15:05:16.000Z (over 1 year ago)
- Last Synced: 2025-01-28T16:22:28.280Z (over 1 year ago)
- Topics: chat-application, javascript, mern-stack, socket-io
- Language: JavaScript
- Homepage:
- Size: 815 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Chatter
## 🚀 Overview
A feature-rich chat application designed for seamless communication. It leverages modern web technologies to provide real-time messaging, media sharing, and a responsive user experience.
---
## ✨ Features
- **Authentication:** Secure user signup, login, and logout.
- **Real-time Chat:** Instant message updates with WebSocket.
- **Media Sharing:** Upload and share images using Cloudinary.
- **User Profiles:** Customizable user profiles.
- **Responsive Design:** Optimized for all devices.
---
## 🛠️ Technologies Used
- **Backend:** Node.js, Express.js, MongoDB (Mongoose), WebSocket (Socket.IO), Cloudinary.
- **Frontend:** React.js (with Vite), TailwindCSS, Zustand.
---
## 🔧 Setup and Installation
### Prerequisites
- Node.js and npm installed
- MongoDB instance
- Cloudinary account
### Steps
1. Clone the repository:
```bash
git clone https://github.com/vedant-io/Chatter.git
cd Chatter
```
2. Install dependencies:
```bash
# Backend
cd backend
npm install
# Frontend
cd ../frontend
npm install
```
3. Configure environment variables:
- Backend: Create a `.env` file in the `backend` folder with:
```env
PORT=5000
MONGO_URI=
CLOUDINARY_NAME=
CLOUDINARY_API_KEY=
CLOUDINARY_API_SECRET=
JWT_SECRET=
```
- Frontend: Update API base URL in `frontend/src/lib/axios.js`.
4. Run the application:
```bash
# Backend
cd backend
npm start
# Frontend
cd ../frontend
npm run dev
```
5. Open the application in your browser:
```
http://localhost:5173
```
---
## 📂 API Overview
Key backend endpoints:
- **Authentication**
- `POST /auth/login`: Login
- `POST /auth/register`: Register
- **Messages**
- `GET /messages`: Fetch messages
- `POST /messages`: Send a message
- **Users**
- `GET /users/:id`: User details
---