Chatgram: Telegram Clone

A full-stack Telegram clone featuring real-time messaging and video calling capabilities.

✨ Features

Core Functionality

Category	Features
Authentication	JWT-based registration & login, Session persistence
Real-Time Chat	WebSocket messaging, Message history, Typing indicators
Multimedia	Video calling (WebRTC), File attachments, Emoji support
UI/UX	Responsive design, Dark/Light themes, Message animations

🚀 API Documentation

Participant Token Generation

Endpoint
GET /api/get-participant-token

Request Parameters

{
  "userId": "string",
  "roomId": "string"
}

Response

{
  "token": "eyJhbGci...",
  "expiresAt": "2025-02-07T18:30:00Z"
}

🛠️ Tech Stack

Category	Technologies
Frontend	Next.js 13, TypeScript, Tailwind CSS, Zustand, React-Query, shadcn/ui
Backend	Node.js, Express, Socket.IO, MongoDB, Redis, JWT
DevOps	Docker, GitHub Actions, ESLint, Prettier

📦 Installation

⚙️ Server

# Clone repository
git clone https://github.com/Asirwad/ChatGram-NextJS-Express-SocketIO.git
cd ChatGram-NextJS-Express-SocketIO/server

# Install dependencies
npm install

# Configure environment
cp client/.env.example client/.env.local
cp server/.env.example server/.env

# Start development
npm run dev

🪶 Client

cd ChatGram-NextJS-Express-SocketIO/client

# Install dependencies
npm install

# Start development
npm run dev

🌐 Environment Variables

Variable	Description	Example
NEXT_PUBLIC_API_URL	Backend API base URL	http://localhost:3001
MONGODB_URI	MongoDB connection string	mongodb://localhost:27017
JWT_SECRET	JWT signing key	super_secret_key_123

📁 Project Structure

ChatGram-NextJS-Express-SocketIO/
├── client/            # Next.js frontend
│   ├── src/app/       # App router
│   └── src/components # UI components
└── server/            # Express backend
    ├── models/        # MongoDB models
    └── routes/        # API endpoints