Build A YouTube Clone in HTML CSS & JavaScript | Website like YouTube in HTML CSS & JavaScript

In the video, I showed how to build a responsive TH-cam website clone using HTML, CSS, and JavaScript. This clone project replicates key features of TH-cam’s website, such as a navbar with search, a categories tab, a grid layout for videos, a collapsible sidebar, and options for dark or light themes.
🖼️ Get Images & Text file of this TH-cam Clone
➤ drive.google.com/drive/folder...
🗂️ Get Source Code of this TH-cam Clone
➤ buymeacoffee.com/codingnepal/...
🌐 Visit CodingNepal for helpful coding projects
➤ www.codingnepalweb.com
⭐ Hire me on Fiverr
➤ www.fiverr.com/prakashahi
📷 Follow me on Instagram
➤ / coding.np
🤝 Support my work with a coffee
➤ buymeacoffee.com/codingnepal
🕔 Timestamps
0:00 TH-cam Homepage Demo
1:52 Starting with HTML & CSS
2:01 Creating the Navigation Bar
12:42 Creating the Categories Tab
16:20 Creating the Video Gallery
28:29 Creating the Side Navigation Bar
36:16 Working on Toggling Sidebar Visibility
47:30 Implementing Dark/Light Theme
🎵 Music Credit:
Ikson - We Are Free [Official]
• #83 We Are Free (Offic...
#html #css #website #javascript #youtube

[@CodingNepal]

Please let me know if the audio is too loud, too soft, or just right.

[@yubiroaster6285]

Sound quality and video quality both are good...Thank you❤️

[@shahmaarbaba]

please help me when i upload my html site on live server the css not update when i change something

[@jamesthemadcoder]

For me it's a bit too loud and am personally not a fan of the clicking keys sound, I would prefer music over - but hey, it's your videos, do what you feel like 👌(great content by the way!)

[@fauzulkabir9300]

is this is possible in python that there was some block of information = - multiply and whhen put number first it want so it would be plus and the multiply and when or we say formula that call the plus then number plus and then divide it goes to that block and became multiply and come back like in html like class in first class color white font bold and in second class there will be color blue and font is italic

[@OngieDefistlady]

We want the music back

[@xbodoubles8974]

You are really good with JavaScript, I love that.

[@CodingNepal]

Happy to hear that! Keep watching.

[@fauzulkabir9300]

is this is possible in python that there was some block of information = - multiply and whhen put number first it want so it would be plus and the multiply and when or we say formula that call the plus then number plus and then divide it goes to that block and became multiply and come back like in html like class in first class color white font bold and in second class there will be color blue and font is italic

[@yubiroaster6285]

Just Amazing sir 🌟

[@CodingNepal]

Thank you

[@hugohamonangan9639]

Amazing, and good asmr keyboard tho

[@CodingNepal]

Glad you like it. Keep watching!

[@fauzulkabir9300]

is this is possible in python that there was some block of information = - multiply and whhen put number first it want so it would be plus and the multiply and when or we say formula that call the plus then number plus and then divide it goes to that block and became multiply and come back like in html like class in first class color white font bold and in second class there will be color blue and font is italic

[@benherobrine2709]

i wanted to make youtube clone website called david media, i might learn java script, html and css with this video, thanks ❤

[@gamingpro741]

nice work friend

[@CodingNepal]

Thank you.. Keep watching

[@fauzulkabir9300]

@@CodingNepal is this is possible in python that there was some block of information = - multiply and whhen put number first it want so it would be plus and the multiply and when or we say formula that call the plus then number plus and then divide it goes to that block and became multiply and come back like in html like class in first class color white font bold and in second class there will be color blue and font is italic

[@nguyeninhtoan4254]

Long time i see you coding ❤

[@CodingNepal]

Thank you.. keep supporting

[@terstegen3505]

niceee proo🥰🥰

[@fauzulkabir9300]

is this is possible in python that there was some block of information = - multiply and whhen put number first it want so it would be plus and the multiply and when or we say formula that call the plus then number plus and then divide it goes to that block and became multiply and come back like in html like class in first class color white font bold and in second class there will be color blue and font is italic

[@rikscc]

Sehr geil 🤩

[@fauzulkabir9300]

is this is possible in python that there was some block of information = - multiply and whhen put number first it want so it would be plus and the multiply and when or we say formula that call the plus then number plus and then divide it goes to that block and became multiply and come back like in html like class in first class color white font bold and in second class there will be color blue and font is italic

[@ashishicyy]

So attractive bro

[@fauzulkabir9300]

is this is possible in python that there was some block of information = - multiply and whhen put number first it want so it would be plus and the multiply and when or we say formula that call the plus then number plus and then divide it goes to that block and became multiply and come back like in html like class in first class color white font bold and in second class there will be color blue and font is italic

[@weslacerda]

Ifood clone go! It was worth it all.

[@fauzulkabir9300]

is this is possible in python that there was some block of information = - multiply and whhen put number first it want so it would be plus and the multiply and when or we say formula that call the plus then number plus and then divide it goes to that block and became multiply and come back like in html like class in first class color white font bold and in second class there will be color blue and font is italic

[@Fnydo]

Please used a proper typography in css for next video. We like it.

[@surajrawat1683]

i love your videos❤❤

[@CodingNepal]

Thank you.. Keep loving.

[@surajrawat1683]

@@CodingNepal❤

[@fauzulkabir9300]

@@CodingNepal is this is possible in python that there was some block of information = - multiply and whhen put number first it want so it would be plus and the multiply and when or we say formula that call the plus then number plus and then divide it goes to that block and became multiply and come back like in html like class in first class color white font bold and in second class there will be color blue and font is italic

[@gamingpro741]

hm can you make video about websockets and how to be have a ferquent connection between the both of user and browser ?

[@marpusik1277]

more please tailwind CSS 🙏

[@fauzulkabir9300]

is this is possible in python that there was some block of information = - multiply and whhen put number first it want so it would be plus and the multiply and when or we say formula that call the plus then number plus and then divide it goes to that block and became multiply and come back like in html like class in first class color white font bold and in second class there will be color blue and font is italic

[@fauzulkabir9300]

is this is possible in python that there was some block of information = - multiply and whhen put number first it want so it would be plus and the multiply and when or we say formula that call the plus then number plus and then divide it goes to that block and became multiply and come back like in html like class in first class color white font bold and in second class there will be color blue and font is italic

[@luswaa6472]

amazing

[@CodingNepal]

Thanks

[@fauzulkabir9300]

@@CodingNepal is this is possible in python that there was some block of information = - multiply and whhen put number first it want so it would be plus and the multiply and when or we say formula that call the plus then number plus and then divide it goes to that block and became multiply and come back like in html like class in first class color white font bold and in second class there will be color blue and font is italic

[@nctzen_johnbanana1340]

Pls give explanation and code bro. Many will surely appreciate

[@abhay1446]

Bhai apke audio bhi dalna ,samjateh hue ITZ request

[@user-ii8oc8mf1k]

Peut t-on avoir les sources d'images utilisées pour le contenu ??

[@CodingNepal]

Yes, images and details file link in this video description.

[@heelpatel35]

Make it using MERN Stack

[@CodingNepal]

Sure, stay tuned.

[@marvel4834]

Bro I have a project which I tried a lot to make but I couldn't. I am new to learning web development. I didn't get any help to make the project. Can you please make a tutorial of my projector which you will upload on youtube. Please help build the project. How can I contact you to share my project? Please reply to me.❤❤❤

[@user-kn7wo4rj8z]

How top scrollbar work

[@CodingNepal]

On Windows, you can scroll horizontally by holding shift and using the mouse wheel (shift + mouse wheel).

[@ardaoffcial]

Next admin creates a feature dashboard template like a blogger widget

[@codeweb4u]

TH-cam video downloader app create

[@codingDSS]

Here in your javascript source code there is a problem ! why you don't use root: element in css and import it in javascript to make day / dark mode easy for you and for me, you've made your code a little complicated. here example to understand me // :
//open css source code !!
/________/
:root{
--body-color: #fff;
}
:root.dark{
--body-color: #111;
}
body{
background: var(--body-color);
}
/________/
//close css source code !!
//open javascript source code :
/________/
var basic = document.querySelector(":root");
var button = document.getElementById("button");
button.addEventListener("click", ()=>{
return basic.classList.toggle("dark")
})
/________/
//close javascript source code !!
//Admin comment source code
/________/
//__I hope this code is helpful and thank you 😀😃😊😌😌😶😶😶__
//__If any of you like my way, please subscribe to my channel __
/________/
//Break

[@RizwanKhan-ji]

Bro iski html file mil sakti hai kya dusra youtube hai ye

[@CodingNepal]

Here is the source code: www.codingnepalweb.com/build-youtube-homepage-clone-html-css/

[@RizwanKhan-ji]

@@CodingNepal sorce code ko xml kaise karna hai uspar hi video bana do ya fir html file dedo

[@TankaKafle]

Voice

[@ArslonGameer]

plz free source code

[@mohammedismailhossainshihab]

My JavaScript is not working 😢

[@CodingNepal]

What's not working? You can see browser console if there are any errors.

[@mohammedismailhossainshihab]

@@CodingNepal It's fixed now. One place "Click" was in lowercase. I put it in uppercase. Forgot that javaScript is case sensitive.

[@CodingNepal]

Glad to hear that your issue has been resolved.. Happy coding!

[@codeweb4u]

TH-cam video downloader app create

[@codeweb4u]

TH-cam video downloader app create