This project is a YouTube clone built using React and Vite, providing a minimal setup with Hot Module Replacement (HMR) and some ESLint rules. It offers two official plugins for React:
- @vitejs/plugin-react which uses Babel for Fast Refresh.
- @vitejs/plugin-react-swc which uses SWC for Fast Refresh.
This application replicates the core functionality of YouTube, allowing users to view videos, search for content, and play videos. It utilizes the YouTube Data API for fetching video details.
- Search for videos by keywords.
- View video details including title, description, and channel information.
- Play videos directly within the application.
- Responsive design for various screen sizes.
-
Clone the Repository
git clone https://github.com/rajanprajapati1/You_Tube_Clone.git cd You_Tube_Clone
-
Install Dependencies
npm install
-
Set up API Key
Obtain a YouTube Data API Key from the Google Developers Console. Add this key to your environment variables or directly in the code where required.
-
Start the Application
npm run dev
This will start the development server and you can access the app at
http://localhost:3000
.
src/
|-- components/
| |-- Video.js
| |-- VideoList.js
| |-- ...
|-- pages/
| |-- Home.js
| |-- VideoDetail.js
| |-- ...
|-- utils/
| |-- api.js
| |-- ...
|-- App.js
|-- index.html
|-- main.js
|-- ...
Open utils/api.js
and replace 'YOUR_API_KEY'
with your actual YouTube Data API Key.
const API_KEY = 'YOUR_API_KEY';
export default API_KEY;
If you'd like to contribute to this project, please fork the repository and create a pull request.
This project is licensed under the MIT License.
- React Team
- Vite Team
- SWC Team
Feel free to customize this template with additional information about your project, technologies used, and any special instructions for contributors. Include screenshots or GIFs to showcase your application.