Skip to content

Chu-rill/Banter

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Β 

History

159 Commits
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 

Repository files navigation

πŸš€ Banter - Modern Chat & Video Calling Platform

Next.js NestJS TypeScript Tailwind CSS Socket.IO Prisma

A modern, full-stack real-time communication platform featuring instant messaging, HD video calls, file sharing, and collaborative spaces. Built with cutting-edge web technologies for optimal performance and user experience.

✨ Features

πŸ—¨οΈ Real-time Messaging

  • Instant messaging with typing indicators and read receipts
  • Emoji support with emoji picker
  • File sharing (images, videos, documents)
  • Message history with pagination
  • Private and group chats

πŸ“Ή Video & Voice Calls

  • HD video calling with WebRTC
  • Screen sharing capabilities
  • Audio-only calls option
  • Call history and statistics
  • Multi-participant support

πŸ” Authentication & Security

  • Email/Password authentication
  • Google OAuth integration
  • JWT-based security
  • Protected routes and API endpoints
  • Email verification system

🏠 Room Management

  • Public and private rooms
  • Room creation and joining
  • Participant management
  • Room-specific settings
  • Video/chat/hybrid room modes

🎨 User Experience

  • Dark/Light theme support
  • Responsive design (mobile-first)
  • Real-time online status
  • Friend system
  • User profiles and avatars
  • Modern glassmorphism UI

πŸ—οΈ Architecture

Frontend (Client)

  • Framework: Next.js 15 with App Router
  • Language: TypeScript
  • Styling: Tailwind CSS v4
  • UI Components: Radix UI primitives
  • State Management: React Context + Hooks
  • Real-time: Socket.IO Client
  • Forms: React Hook Form + Zod validation
  • HTTP Client: Axios

Backend (Server)

  • Framework: NestJS
  • Language: TypeScript
  • Database: PostgreSQL with Prisma ORM
  • Authentication: Passport.js (JWT + Google OAuth)
  • Real-time: Socket.IO
  • File Upload: Multer
  • Email: Nodemailer
  • Caching: Redis
  • API Documentation: Swagger

Infrastructure

  • Database: PostgreSQL
  • Cache: Redis
  • File Storage: Local/Cloud storage
  • WebRTC: Peer-to-peer connections
  • Email Service: SMTP (Gmail/SendGrid)

πŸš€ Quick Start

Prerequisites

  • Node.js 18+ and npm
  • PostgreSQL database
  • Redis server
  • Google OAuth credentials (optional)

1. Clone the Repository

git clone https://github.com/yourusername/banter.git
cd banter

2. Backend Setup

cd server
npm install
cp .env.example .env
# Configure your environment variables
npm run db:migrate
npm run start:dev

3. Frontend Setup

cd client
npm install
cp .env.example .env.local
# Configure your environment variables
npm run dev

4. Access the Application

πŸ“ Project Structure

banter/
β”œβ”€β”€ client/                 # Next.js Frontend Application
β”‚   β”œβ”€β”€ src/
β”‚   β”‚   β”œβ”€β”€ app/           # App Router pages
β”‚   β”‚   β”œβ”€β”€ components/    # React components
β”‚   β”‚   β”œβ”€β”€ contexts/      # React contexts
β”‚   β”‚   β”œβ”€β”€ lib/          # Utilities and API client
β”‚   β”‚   └── types/        # TypeScript type definitions
β”‚   β”œβ”€β”€ public/           # Static assets
β”‚   └── package.json
β”‚
β”œβ”€β”€ server/                # NestJS Backend Application
β”‚   β”œβ”€β”€ src/
β”‚   β”‚   β”œβ”€β”€ auth/         # Authentication modules
β”‚   β”‚   β”œβ”€β”€ user/         # User management
β”‚   β”‚   β”œβ”€β”€ room/         # Room/chat functionality
β”‚   β”‚   β”œβ”€β”€ message/      # Message handling
β”‚   β”‚   β”œβ”€β”€ call/         # Video call features
β”‚   β”‚   β”œβ”€β”€ upload/       # File upload handling
β”‚   β”‚   └── common/       # Shared utilities
β”‚   β”œβ”€β”€ prisma/           # Database schema and migrations
β”‚   └── package.json
β”‚
β”œβ”€β”€ docs/                 # Documentation
β”œβ”€β”€ GOOGLE_OAUTH_SETUP.md # OAuth setup guide
└── README.md            # This file

πŸ”§ Configuration

Environment Variables

Client (.env.local)

NEXT_PUBLIC_API_URL=http://localhost:5000/api/v1

Server (.env)

# Database
DATABASE_URL=postgresql://username:password@localhost:5432/banter_db

# Authentication
JWT_SECRET=your_jwt_secret
GOOGLE_CLIENT_ID=your_google_client_id
GOOGLE_CLIENT_SECRET=your_google_client_secret

# Redis
REDIS_URL=redis://localhost:6379

# Email
SMTP_HOST=smtp.gmail.com
SMTP_PORT=587
SMTP_USER=your_email@gmail.com
SMTP_PASS=your_app_password

See .env.example files in each directory for complete configuration options.

πŸ§ͺ Testing

Backend Testing

cd server
npm run test          # Unit tests
npm run test:e2e      # End-to-end tests
npm run test:cov      # Coverage report

Frontend Testing

cd client
npm run test          # Jest tests
npm run test:watch    # Watch mode

πŸ“š API Documentation

The backend provides comprehensive API documentation through Swagger:

Key API Endpoints

  • POST /auth/login - User login
  • POST /auth/register - User registration
  • GET /oauth/google - Google OAuth initiation
  • GET /rooms - Get user rooms
  • POST /rooms - Create new room
  • GET /messages/room/:id - Get room messages
  • POST /messages - Send message

πŸ”’ Security Features

  • JWT Authentication with refresh tokens
  • Google OAuth 2.0 integration
  • Input validation with Zod schemas
  • SQL injection protection via Prisma
  • XSS protection with proper sanitization
  • CORS configuration for cross-origin requests
  • Rate limiting on API endpoints
  • File upload restrictions and validation

🚒 Deployment

Frontend (Vercel/Netlify)

cd client
npm run build
npm run start

Backend (Railway/Heroku/VPS)

cd server
npm run build
npm run start:prod

Database Migration

cd server
npm run db:migrate
npm run db:generate

🀝 Contributing

  1. Fork the repository
  2. Create a feature branch: git checkout -b feature/amazing-feature
  3. Commit changes: git commit -m 'Add amazing feature'
  4. Push to branch: git push origin feature/amazing-feature
  5. Open a Pull Request

Development Guidelines

  • Follow TypeScript best practices
  • Use conventional commits
  • Add tests for new features
  • Update documentation as needed
  • Follow ESLint and Prettier configurations

πŸ“„ License

This project is licensed under the MIT License - see the LICENSE file for details.

πŸ™ Acknowledgments

  • Next.js team for the amazing React framework
  • NestJS team for the powerful Node.js framework
  • Tailwind CSS for the utility-first CSS framework
  • Socket.IO for real-time communication
  • Prisma for the excellent database toolkit

πŸ“ž Support


Built with ❀️ for better communication

About

πŸš€ Modern real-time chat and video calling platform built with Next.js, NestJS, WebRTC, and Socket.io. Features Google OAuth, file sharing, room management, and responsive design.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors