🎬 VidNest - Professional Video Sharing Platform

🚀 A Production-Grade Video Sharing Platform Built with MERN Stack

Upload, Stream, Engage, and Build Your Community

Features • Tech Stack • Architecture • Getting Started • API Docs

📌 Project Overview

VidNest is a full-featured, enterprise-grade video sharing platform similar to YouTube, built from the ground up using modern web technologies. This project demonstrates advanced full-stack development practices with a production-ready backend architecture, comprehensive API design, real-time notifications, and a polished React frontend.

🎯 Core Capabilities

Complete Video Platform: Upload, stream, edit, and manage video content with cloud storage
Social Features: Comments, likes, subscriptions, and real-time notifications
Content Organization: Custom playlists, watch history, and content discovery
Creator Dashboard: Analytics, video management, and channel statistics
Photo Posts (Tweets): Share images with captions alongside video content
Advanced Search: Filter and discover content with sophisticated search algorithms
Security First: JWT authentication, bcrypt password hashing, rate limiting, and CORS protection

✨ Features

🎬 Video Management

Multi-file upload with Multer middleware
Cloud storage via Cloudinary CDN
Responsive video player with React Player
Watch history tracking and view count analytics
Like/dislike system with real-time updates
Video management dashboard with analytics

👤 User Authentication & Authorization

JWT-based token authentication (access + refresh tokens)
HTTP-only secure cookies for token storage
Bcrypt password hashing
Email verification and password reset
Customizable user profiles and channel pages

📱 Social Features

Comment system on videos and tweets
Like/unlike videos, tweets, and comments
Subscribe/unsubscribe to channels
Real-time notifications system
User activity feed

📢 Notifications System

Real-time notifications for likes, comments, and subscriptions
Unread notification badge counter
Mark as read/delete functionality
Notification history with pagination

🎭 Photo Posts (Tweets)

Upload photos with captions
Like and comment on tweets
User tweet feed and detail pages

📚 Playlist Management

Create and manage custom playlists
Add/remove videos from playlists
Public/private playlist settings

📊 Creator Dashboard

Channel analytics and statistics
Video and content management
Comment management

🔍 Advanced Search

Full-text search across videos
Filter and sort options
Optimized MongoDB text indexes

🎨 User Interface

Responsive design with Tailwind CSS
Dark theme interface
Toast notifications
Loading states and skeleton screens
Form validation

🏗 System Architecture

High-Level Architecture

┌─────────────────────────────────────────────────────────────┐
│                     CLIENT (Browser)                        │
│  React 19 + Vite + Tailwind CSS + Redux Toolkit             │
└────────────┬────────────────────────────────────────────────┘
             │ HTTP/HTTPS
             │
┌────────────▼────────────────────────────────────────────────┐
│                   API GATEWAY LAYER                         │
│  Express.js + CORS + Rate Limiting + Cookie Parser          │
└────────────┬────────────────────────────────────────────────┘
             │
     ┌───────┴───────┐
     │               │
┌────▼─────┐  ┌─────▼──────┐
│  Auth    │  │ Business   │
│  Layer   │  │  Logic     │
│  JWT     │  │ Controllers│
└────┬─────┘  └─────┬──────┘
     │               │
     └───────┬───────┘
             │
┌────────────▼────────────────────────────────────────────────┐
│                    DATA ACCESS LAYER                        │
│  Mongoose ODM + MongoDB Aggregation Pipelines               │
└────────────┬────────────────────────────────────────────────┘
             │
     ┌───────┴────────┬─────────────┐
     │                │             │
┌────▼─────┐  ┌──────▼──────┐ ┌───▼─────┐
│ MongoDB  │  │ Cloudinary  │ │ Email   │
│ Database │  │ CDN Storage │ │ Service │
└──────────┘  └─────────────┘ └─────────┘

🛠 Tech Stack

Frontend Technologies

Technology	Version	Purpose
React	19.2.0	Core UI library
Vite	7.2.4	Build tool and dev server
Redux Toolkit	2.11.0	State management
React Router	7.10.0	Client-side routing
Axios	1.13.2	HTTP client
Tailwind CSS	3.4.17	CSS framework
Lucide React	0.556.0	Icon library
React Hot Toast	2.6.0	Toast notifications
React Hook Form	7.68.0	Form validation
React Player	3.4.0	Video player
Recharts	3.6.0	Data visualization

Backend Technologies

Technology	Version	Purpose
Node.js	18+	JavaScript runtime
Express.js	5.1.0	Web framework
MongoDB	8.19.0	NoSQL database
Mongoose	8.19.0	MongoDB ODM
JWT	9.0.2	Authentication
Bcrypt	6.0.0	Password hashing
Multer	2.0.2	File upload handling
Cloudinary	2.7.0	Cloud media storage
Nodemailer	7.0.12	Email service
CORS	2.8.5	Cross-Origin Resource Sharing

🚀 Getting Started

Prerequisites

Node.js (v18.0.0 or higher)
MongoDB (v6.0+) - Local or MongoDB Atlas
Git
Cloudinary Account (free tier)
Gmail Account (for email service)

Installation & Setup

Step 1: Clone the Repository

git clone https://github.com/Prajjwal2051/VidNest.git
cd VidNest

Step 2: Backend Setup

# Install backend dependencies
npm install

# Create environment variables file
cp .env.example .env

Configure .env file:

# Server Configuration
PORT=8000

# Database Configuration
MONGODB_URI=mongodb://localhost:27017/VidNest

# CORS Configuration
CORS_ORIGIN=http://localhost:5173

# JWT Secrets (Generate random strings)
ACCESS_TOKEN_SECRET=your_super_secret_access_token_here_min_32_chars
ACCESS_TOKEN_EXPIRY=1d
REFRESH_TOKEN_SECRET=your_super_secret_refresh_token_here_min_32_chars
REFRESH_TOKEN_EXPIRY=10d

# Cloudinary Configuration
CLOUDINARY_CLOUD_NAME=your_cloud_name
CLOUDINARY_API_KEY=your_api_key
CLOUDINARY_API_SECRET=your_api_secret

# Email Configuration (Gmail)
EMAIL_HOST=smtp.gmail.com
EMAIL_PORT=587
EMAIL_USER=[email protected]
EMAIL_PASSWORD=your-gmail-app-password
EMAIL_FROM=[email protected]

Generate Secure Secrets:

node -e "console.log(require('crypto').randomBytes(64).toString('hex'))"

Step 3: Frontend Setup

cd frontend/VideNestFrontEnd
npm install

# Create frontend environment file
echo 'VITE_API_BASE_URL=http://localhost:8000/api/v1' > .env

Step 4: Start the Application

# Terminal 1: Start Backend (from project root)
npm run dev
# Backend runs on http://localhost:8000

# Terminal 2: Start Frontend (from frontend/VideNestFrontEnd)
cd frontend/VideNestFrontEnd
npm run dev
# Frontend runs on http://localhost:5173

Step 5: Access the Application

Frontend: http://localhost:5173
Backend API: http://localhost:8000/api/v1
Health Check: http://localhost:8000/api/v1/users/health

📁 Project Structure

VidNest/
│
├── 📂 src/                          # Backend source code
│   ├── 📂 controllers/              # Request handlers
│   ├── 📂 models/                   # MongoDB Schemas
│   ├── 📂 routes/                   # API route definitions
│   ├── 📂 middlewares/              # Custom middleware
│   ├── 📂 utils/                    # Helper functions
│   ├── 📂 db/                       # Database connection
│   ├── app.js                       # Express app configuration
│   ├── index.js                     # Server entry point
│   └── constants.js                 # App constants
│
├── 📂 frontend/VideNestFrontEnd/   # React frontend
│   ├── 📂 src/
│   │   ├── 📂 api/                  # API client functions
│   │   ├── 📂 components/           # React components
│   │   ├── 📂 pages/                # Route pages (22 pages)
│   │   ├── 📂 store/                # Redux state management
│   │   ├── 📂 context/              # React Context
│   │   ├── 📂 hooks/                # Custom React hooks
│   │   └── App.jsx                  # Root component
│   └── package.json                 # Frontend dependencies
│
├── 📂 public/                       # Static files
├── .env.example                     # Environment template
├── package.json                     # Backend dependencies
└── README.md                        # Documentation

🔐 Authentication & Security

Authentication Flow

1. User Login (email + password)
2. Backend verifies credentials with bcrypt
3. Generate JWT tokens (access + refresh)
4. Set HTTP-only cookies (secure, sameSite)
5. Client authenticated with tokens

Security Features

Password Security: Bcrypt hashing with 10 salt rounds
JWT Authentication: Access + refresh token pattern
HTTP-Only Cookies: Protection against XSS attacks
CORS Protection: Strict origin validation
Rate Limiting: Prevent API abuse
Input Validation: MongoDB injection prevention
File Upload Security: Type and size validation

Protected Route Middleware

// verifyJWT middleware
export const verifyJWT = asyncHandler(async (req, res, next) => {
    const token = req.cookies?.accessToken || 
                  req.header("Authorization")?.replace("Bearer ", "")
    
    if (!token) {
        throw new ApiError(401, "Unauthorized request")
    }
    
    const decodedToken = jwt.verify(token, process.env.ACCESS_TOKEN_SECRET)
    const user = await User.findById(decodedToken?._id).select("-password -refreshToken")
    
    if (!user) {
        throw new ApiError(401, "Invalid access token")
    }
    
    req.user = user
    next()
})

📚 API Documentation

API Base URL

Development: http://localhost:8000/api/v1
Production: https://your-domain.com/api/v1

Complete API Endpoints

🔐 Authentication & User Management

POST /api/v1/users/register          # Register new user
POST /api/v1/users/login             # User login
POST /api/v1/users/logout            # Logout
POST /api/v1/users/refresh-token     # Refresh access token
POST /api/v1/users/forgot-password   # Request password reset
POST /api/v1/users/reset-password/:token  # Reset password
GET  /api/v1/users/current-user      # Get current user
POST /api/v1/users/change-password   # Change password
PATCH /api/v1/users/update-account   # Update account details
PATCH /api/v1/users/avatar           # Update avatar
PATCH /api/v1/users/cover-image      # Update cover image
GET  /api/v1/users/c/:username       # Get channel profile
GET  /api/v1/users/watch-history     # Get watch history

🎬 Video Management

GET    /api/v1/videos                # Get all videos (paginated)
GET    /api/v1/videos/:videoId       # Get video by ID
POST   /api/v1/videos                # Upload video
PATCH  /api/v1/videos/:videoId       # Update video
DELETE /api/v1/videos/:videoId       # Delete video
PATCH  /api/v1/videos/toggle/publish/:videoId  # Toggle publish status
PATCH  /api/v1/videos/:videoId/view  # Increment view count

💬 Comments

GET    /api/v1/comments/:videoId     # Get video comments
GET    /api/v1/comments/t/:tweetId   # Get tweet comments
GET    /api/v1/comments/user/me      # Get user's comments
POST   /api/v1/comments              # Add comment
PATCH  /api/v1/comments/:commentId   # Update comment
DELETE /api/v1/comments/:commentId   # Delete comment

❤️ Likes

POST /api/v1/like/video/:videoId     # Toggle video like
POST /api/v1/like/comment/:commentId # Toggle comment like
POST /api/v1/like/tweet/:tweetId     # Toggle tweet like
GET  /api/v1/like/status/video/:videoId  # Get like status
GET  /api/v1/like/videos             # Get liked videos
GET  /api/v1/like/tweets             # Get liked tweets
GET  /api/v1/like/comments           # Get liked comments

👥 Subscriptions

POST /api/v1/subscription/c/:channelId  # Toggle subscription
GET  /api/v1/subscription/c/:channelId/subscribers  # Get subscribers
GET  /api/v1/subscription/u/:userId/subscribed  # Get subscribed channels

🔔 Notifications

GET    /api/v1/notifications         # Get all notifications
PATCH  /api/v1/notifications/:notificationId/read  # Mark as read
PATCH  /api/v1/notifications/read-all  # Mark all as read
DELETE /api/v1/notifications/:notificationId  # Delete notification

📚 Playlists

POST   /api/v1/playlists             # Create playlist
GET    /api/v1/playlists/user/:userId  # Get user playlists
GET    /api/v1/playlists/:playlistId # Get playlist by ID
PATCH  /api/v1/playlists/:playlistId # Update playlist
DELETE /api/v1/playlists/:playlistId # Delete playlist
PATCH  /api/v1/playlists/add/:playlistId/:videoId  # Add video
PATCH  /api/v1/playlists/remove/:playlistId/:videoId  # Remove video

📸 Tweets

GET    /api/v1/tweets                # Get all tweets
GET    /api/v1/tweets/:tweetId       # Get tweet by ID
GET    /api/v1/tweets/user/:userId   # Get user tweets
POST   /api/v1/tweets                # Create tweet
PATCH  /api/v1/tweets/:tweetId       # Update tweet
DELETE /api/v1/tweets/:tweetId       # Delete tweet

📊 Dashboard & Analytics

GET /api/v1/dashboard/stats/:channelId  # Get channel statistics
GET /api/v1/dashboard/videos/:channelId # Get channel videos

🔍 Search

GET /api/v1/search?query=keyword     # Search videos

Standard Response Format

Success Response:

{
  "statusCode": 200,
  "data": { ... },
  "message": "Operation successful",
  "success": true
}

Error Response:

{
  "statusCode": 400,
  "data": null,
  "message": "Error message",
  "success": false,
  "errors": []
}

📄 License & Copyright

Copyright Notice

Copyright © 2026 Prajjwal. All Rights Reserved.

VidNest - Video Sharing Platform

UNAUTHORIZED USE, REPRODUCTION, OR DISTRIBUTION IS STRICTLY PROHIBITED.

For licensing inquiries, please contact the author.

📞 Contact & Support

Author

Prajjwal - Full-Stack Developer | MERN Stack Specialist

Links

GitHub: @Prajjwal2051
Repository: github.com/Prajjwal2051/VidNest

🔐 Security Disclosure

If you discover a security vulnerability, email the author directly. Do not create public GitHub issues for security vulnerabilities.

⭐ Show Your Support

⭐ Star this repository on GitHub
🔗 Share with fellow developers
💬 Provide feedback through issues

Built with ❤️ by Prajjwal using React, Node.js, Express, and MongoDB

Last Updated: January 2026

Name		Name	Last commit message	Last commit date
Latest commit History 196 Commits
frontend/VideNestFrontEnd		frontend/VideNestFrontEnd
public		public
src		src
.env.example		.env.example
.gitignore		.gitignore
.prettierignore		.prettierignore
.prettierrc		.prettierrc
README.md		README.md
package-lock.json		package-lock.json
package.json		package.json
render.yaml		render.yaml

Prajjwal2051/Viewly

Folders and files

Latest commit

History

Repository files navigation

🎬 VidNest - Professional Video Sharing Platform

🚀 A Production-Grade Video Sharing Platform Built with MERN Stack

📌 Project Overview

🎯 Core Capabilities

📋 Table of Contents

✨ Features

🎬 Video Management

👤 User Authentication & Authorization

📱 Social Features

📢 Notifications System

🎭 Photo Posts (Tweets)

📚 Playlist Management

📊 Creator Dashboard

🔍 Advanced Search

🎨 User Interface

🏗 System Architecture

High-Level Architecture

🛠 Tech Stack

Frontend Technologies

Backend Technologies

🚀 Getting Started

Prerequisites

Installation & Setup

Step 1: Clone the Repository

Step 2: Backend Setup

Step 3: Frontend Setup

Step 4: Start the Application

Step 5: Access the Application

📁 Project Structure

🔐 Authentication & Security

Authentication Flow

Security Features

Protected Route Middleware

📚 API Documentation

API Base URL

Complete API Endpoints

🔐 Authentication & User Management

🎬 Video Management

💬 Comments

❤️ Likes

👥 Subscriptions

🔔 Notifications

📚 Playlists

📸 Tweets

📊 Dashboard & Analytics

🔍 Search

Standard Response Format

📄 License & Copyright

Copyright Notice

📞 Contact & Support

Author

Links

🔐 Security Disclosure

⭐ Show Your Support

About

Topics

Resources

Uh oh!

Stars

Watchers

Forks

Releases

Packages 0

Contributors 2

Uh oh!

Languages

Packages