- Home
- Search
- Microphone
- App-How to make a Great Project for Internships
- 1,234,567 views
- 10:30
- Resurent.html - HTML programming - Visual Studio Code
- 987,654 views
- 8:45
- SaveTube.App-20220706 twilight
- 3,456,789 views
- 15:20
- SaveTube.App-C in 100 Seconds
- 4,567,890 views
- 12:15
- App-I solved 541 Leetcode problems. But you need only 150.-(480p)
- 3,456,789 views
- 15:20
- App-Java in 100 Seconds
- 3,456,789 views
- 15:20
- SaveTube.App-Python in 100 Seconds
- 3,456,789 views
- 15:20
- SaveTube.App-status of sky with moving cloud
- 3,456,789 views
- 15:20
- Resurent.html - HTML programming - Visual Studio Code 2023-08-16 18-06-09
- 3,456,789 views
- 15:20
- SaveTube.App-I solved 541 Leetcode problems. But you need only 150.-(480p)
- 3,456,789 views
- 15:20
- YouTube Video 1
- YouTube Video 2
- YouTube Video 3
- YouTube Video 4
- YouTube Video 5
- YouTube Video 6
- YouTube Video 7
- YouTube Video 8
I Just Create A Clone Of YouTube
# YouTube Clone
This is a YouTube clone built using HTML, CSS, and JavaScript. It features a search bar, a list of trending videos, and a video player.
## Getting Started
To get started, clone the repository and install the dependencies.
git clone https://github.com/elonerajeev/YouTube-Clone.git cd YouTube-Clone npm install
## Running the App
To run the app, start the development server.
npm start
The app will be available at http://localhost:3000.
## Code Structure
The code is structured as follows:
* `index.html`: The main HTML file.
* `style.css`: The CSS file.
* `script.js`: The JavaScript file.
## HTML
The HTML file contains the basic structure of the app. It includes the header, the search bar, the list of trending videos, and the video player.
```html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>YouTube Clone by @Elonerajeev.ai</title>
<link rel="icon" type="image/png" href="desktop.png">
<!-- Icons Templates -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css"
integrity="sha512-z3gLpd7yknf1YoNbCzqRKc4qyor8gaKU1qmn+CShxbuBusANI9QpRohGBreCFkKxLhei6S9CQXFEbbKuqLg0DA=="
crossorigin="anonymous" referrerpolicy="no-referrer" />
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<link rel="stylesheet" href="style.css">
</head>
<body>
<header>
<div class="navbar">
<!-- nav1 -->
<div class="logo-text">
<div class="menu-icons">
## YouTube Clone Project
This is a YouTube clone project built using HTML, CSS, and JavaScript. The project is fully responsive and works on all devices.
### Getting Started
To get started, clone the project repository to your local machine.
git clone https://github.com/elonerajeev/youtube-clone.git
Once the project is cloned, open the `index.html` file in your preferred code editor.
### HTML
The HTML code for the project is relatively simple. The main elements are the `header`, `main`, and `footer` elements.
The `header` element contains the navigation bar, which includes the YouTube logo, the search bar, and the user menu.
The `main` element contains the main content of the page, which includes the trending videos, the video categories, and the individual video pages.
The `footer` element contains the copyright information and the social media links.
### CSS
The CSS code for the project is more complex than the HTML code. The CSS code is responsible for the styling of the project, including the colors, fonts, and layout.
The main CSS file for the project is `style.css`. This file contains all of the CSS rules for the project.
### JavaScript
The JavaScript code for the project is responsible for the interactivity of the project, such as the search bar, the video player, and the user menu.
The main JavaScript file for the project is `script.js`. This file contains all of the JavaScript code for the project.
### Running the Project
To run the project, open the `index.html` file in your preferred web browser.
The project should now be running and you should be able to see the YouTube clone.
### Conclusion
This YouTube clone project is a great way to learn how to build a web application using HTML, CSS, and JavaScript. The project is fully responsive and works on all devices.