Coder Social home page Coder Social logo

ayushagnihotri2025 / youtube-ads-clone Goto Github PK

View Code? Open in Web Editor NEW
11.0 1.0 9.0 3.35 MB

YouTube Ads Clone using pure & simple JS ❤️.

Home Page: https://AyushAgnihotri2025.github.io/YouTube-Ads-Clone/

License: MIT License

HTML 10.86% JavaScript 61.05% CSS 28.09%
css3 hackertoberfest hacktoberfest2022 html-css-javascript html5 javascript hacktoberfest student-vscode github learn hacktoberfest-accepted open-source opensource kwoc kwoc2022

youtube-ads-clone's Introduction

Youtube Ads Clone

Made By @AyushAgnihotri2025

🪞 How it looks like.

Initial Page
initial
Main Video Input Advertisement Video Input
initial initial
Video Play Button
initial
Video Playing Counter before the Ad Video
initial initial
Ad Video Playing Main Video Resumed
initial initial
Video Replayed using replay button (using video.js contoller) with new Ad timings
initial

🛠️ Installation Steps

1. Fork the project. Click on the icon in the top right to get started

2. Clone the project, you can use the following command:

git clone https://github.com/AyushAgnihotri2025/YouTube-Ads-Clone

3. Navigate to the project directory

cd YouTube-Ads-Clone

🥂 After making a change

1. Create a new branch

git checkout -b YourBranchName

2. Add it to staging area

git add <path to the file you worked on>

3. Commit your changes with

git cz

4. Push your changes

git push

🫴 How to Do Your First Pull Request?

(I am providing some Resource from where you can Learn)

  1. Learn from Video
  2. Open Source Guide

👩🏽‍💻 Contributing

  • Contributions make the open source community such an amazing place to learn, inspire, and create.
  • Any contributions you make are greatly appreciated.
  • Check out our contribution guidelines for more information.

Want to contribute?

Hacktoberfest

For the Hacktoberfest you can raise an issue on what you want to contribute and I will assign it for you. Contact me on:- [email protected]

Code of Conduct

Contributors

Thanks goes to these wonderful people ❤️


🙏🏽 Support

This project needs a star️ from you. Don't forget to leave a star✨ Follow my Github for content


© Ayush Agnihotri 2022
All Rights Reserved

youtube-ads-clone's People

Contributors

1danish-00 avatar ayushagnihotri2025 avatar gamingcapital avatar janhvi52 avatar riya14-dangra avatar somya-kr avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar

youtube-ads-clone's Issues

Adding neon effect on button

Is your feature request related to a problem? Please describe.

As we can see that the button of the page is very simple .
I will add neon effect on it to make it more attractive

Describe the solution you'd like

No response

Describe alternatives you've considered

No response

Additional context

No response

Code of Conduct

  • I agree to follow this project's Code of Conduct

make attractive UI

Is your feature request related to a problem? Please describe.

I want to make attractive UI

Describe the solution you'd like

No response

Describe alternatives you've considered

No response

Additional context

No response

Code of Conduct

  • I agree to follow this project's Code of Conduct

Improving the button by adding hover effects to it

Is your feature request related to a problem? Please describe.

i want to improve the ui and make it look more fascinating by adding some cool hover effects to the buttons!

Describe the solution you'd like

No response

Describe alternatives you've considered

No response

Additional context

No response

Code of Conduct

  • I agree to follow this project's Code of Conduct

Page Responsiveness

What happened?

The page isn't responsive for the mobile devices.

Reproduction steps

Steps to reproduce the behavior:

1. Open website in responsive mode or in any mobile device.
4. See error.

Expected behavior

It should be responsive.

Screenshots

No response

Version

1.0.3 (Edge)

Version (If not available above)

No response

What browsers are you seeing the problem on?

Firefox, Chrome, Safari, Microsoft Edge

Browsers (If not available above)

Samsung Internet Browser

Additional context

The error can be seen on any of the browser and version.

Code of Conduct

  • I agree to follow this project's Code of Conduct

login page for user

Is your feature request related to a problem? Please describe.

A user can come to use you web so each user have a login in it .firstly to have to signup with complete details and then login anytime

Describe the solution you'd like

No response

Describe alternatives you've considered

No response

Additional context

No response

Code of Conduct

  • I agree to follow this project's Code of Conduct

Look Enhancement

Is your feature request related to a problem? Please describe.

It's look has to be more enhanced.

Describe the solution you'd like

No response

Describe alternatives you've considered

No response

Additional context

Anyone interested can work on it further.

Code of Conduct

  • I agree to follow this project's Code of Conduct

Add a preloader to the website

Is your feature request related to a problem? Please describe.

Since the page loading time is more ,the users have to see a black screen in front of them while the page loads
to avoid this, i want to add a fascinating preloader to the website

Describe the solution you'd like

No response

Describe alternatives you've considered

No response

Additional context

No response

Code of Conduct

  • I agree to follow this project's Code of Conduct

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.