YouTubeX cover

? Table of Contents

?About

YouTubeX is a clone of YouTube. It is a simple, yet powerful, application that allows you to watch videos and share them with your friends. It is built using the React framework.

it`s a full mimic of YouTube with most of its features.

✨ Features

  • Authenticate users using json web tokens
  • upload videos & thumbnails to cloud storage
  • like / dislike videos
  • save videos to watch later
  • subscribe to channels && view their videos
  • search for video
  • Show trending videos based on the most viewed videos
  • history of videos watched by the user
  • add comments to videos && could delete them
  • light theme && dark theme

?Technologies Used

Frontend

  • React
  • React-Router dom
  • Redux Toolkit
  • Redux Persist
  • styled-components
  • Axios

backend

  • Node.js
  • Express
  • MongoDB
  • jsonwebtoken for authentication
  • bcrypt for hashing passwords

?Getting Started

  1. Clone the repository
git clone https://github.com/omar214/YouTubeX.git
Bash
  1. Go to the directory of the repository
cd YouTubeX
Bash
  1. to run frontend
cd Client
npm install

npm start
Bash

4.to run backend

cd Server
npm install
npm start

Bash

? Demo

Home page & Sign in & Themes

01.home.themes.sign.in.mp4

Video page & comments enable video sound to hear the video

02.video.comment.mp4

Saved videos & subscription & history

03.saved.sub.history.mp4

Search

04.search.mp4

uploading video & thumbnails

05.upload.video.mp4

? screenshots

  • Sign up
    Sign up


  • Home page
    Home page


  • Light Theme
    Light Theme
    Light Theme


  • Video Page
    Video page


  • Comments
    Comments


  • upload video
    upload video


  • Responsive Design

    • sign up

      sign up responsive


    • home page

    home page responsive


  • video page

video page responsive


  • Upload page

upload responsive


  • tablet View

history page responsive

GitHub

View Github