Skip to content

README.md

Latest commit

 

History

History
91 lines (66 loc) · 2.12 KB

README.md

File metadata and controls

91 lines (66 loc) · 2.12 KB
Raw

YouTube Clone (MERN Stack)

A full-featured YouTube clone built using the MERN stack (MongoDB, Express, React, Node.js) with features like video playback, authentication, data visualization, and a responsive, interactive UI.

Demo Login: username and password : sam16

Features

  • Authentication

  • Google OAuth 2.0 sign in/sign up

  • Session management via JWT

  • Video Playback

  • Watch page with dynamic routing

  • Related videos and recommendations

  • Dynamic UI

  • Color background extracted using color-thief

  • Smooth animations via framer-motion

  • Analytics Dashboard

  • View-based and user-based stats using recharts

  • Responsive Design

  • Mobile-first layout with modern UI components

Tech Stack

Frontend

  • React
  • React Router
  • Framer Motion
  • Recharts
  • Color Thief
  • Axios
  • Tailwind CSS

Backend

  • Node.js
  • Express
  • MongoDB + Mongoose
  • jsonwebtoken
  • bcrypt
  • Google OAuth

Environment Variables

Create .env.local files in both Frontend and Backend directories:

Frontend (Frontend/.env.local)

VITE_GOOGLE_CLIENT_ID=your-google-client-id
VITE_REDIRECT_URI=http://localhost:8000/api/v1/users/google/login
REACT_APP_GOOGLE_CLIENT_ID=your-google-client-id
VITE_API_URL=http://localhost:8000/api/v1
VITE_FRONTEND_BASE_URL=http://localhost:5173
VITE_REDIRECT_URI=http://localhost:8000/api/v1/users/google/login

Backend (Backend/.env)

PORT=8000
MONGO_URI=your-mongodb-uri
JWT_SECRET=your-secret-key
CLIENT_URL=http://localhost:5173
CORS_ORIGIN="http://localhost:5173"
ACCESS_TOKEN_SECRET=your-accesstokens
ACCESS_TOKEN_EXPIRY=1d
REFRESH_TOKEN_SECRET=your-refreshtokens
REFRESH_TOKEN_EXPIRY =10d
CLOUDINARY_CLOUD_NAME=cloudname
CLOUDINARY_API_KEY= yours
CLOUDINARY_SECRET_KEY=yours
GOOGLE_CLIENT_ID=your-google-client-id
GOOGLE_CLIENT_SECRET="your-google-client-secret"
FRONTEND_ORIGIN=http://localhost:5173
NODE_ENV=development