DEV Community

Somanath Goudar
Somanath Goudar

Posted on • Edited on

Build a YouTube Clone with just HTML & CSS + Responsive - For Beginners

Part 1: Building YouTube Clone

Part 2: Adding Responsiveness to the Build

CodePen:

Do you want to improve your HTML & CSS skills? Then Watch this video and follow along with me where we build YouTube Clone using just HTML & CSS. We will be using flexbox and Google font Icons in this project.

Hope You Guys Enjoyed the Video. Like Share Comment and Subscribe to my channel for more videos like these.

Code : https://github.com/somanath-goudar/html-css-projects

You may also like my other posts:

Top comments (15)

Collapse
 
shivams136 profile image
Shivam Sharma

You can convert it into a working demo using codepen or Github-pages. That will be very useful for the viewers.

Collapse
 
somanathgoudar profile image
Somanath Goudar

Hi Shivam, Just Updated the Post with an working Demo using codepen.

Collapse
 
ahanist profile image
ahanist

پروفيل به معناي يک شکل يا مقطع خاص است که معمولاً از مواد مختلفي مانند فولاد، آلومينيوم، چوب و پلاستيک ساخته مي‌شود. پروفيل‌ها به طور عمده در صنايع ساخت و ساز، مهندسي و توليد استفاده مي‌شوند.
انواع پروفيل:
پروفيل‌هاي ساختماني: مانند تيرآهن، نبشي و سپري که در سازه‌هاي ساختماني کاربرد دارند.
پروفيل‌هاي صنعتي: که در توليد قطعات ماشين‌آلات و تجهيزات استفاده مي‌شوند.
پروفيل‌هاي دکوراتيو: براي طراحي داخلي و نماي ساختمان.
قيمت پروفيل کيان پرشيا
ويژگي‌ها:
استحکام: پروفيل‌ها معمولاً براي تحمل بارهاي مختلف طراحي مي‌شوند.
وزن سبک: برخي از پروفيل‌ها مانند آلومينيومي سبک‌تر و قابل حمل‌تر هستند.
انعطاف‌پذيري در طراحي: پروفيل‌ها مي‌توانند به اشکال مختلف برش داده شوند.

Collapse
 
somanathgoudar profile image
Somanath Goudar

Yes Shivam, Will Work on it

Collapse
 
geminii profile image
Jimmy

Hey 👋
Nice rebuild of YouTube but whqt about responsive ? Could be nice to add it 👍

Collapse
 
somanathgoudar profile image
Somanath Goudar

Hey, Just Updated the post with Responsiveness of the build. I added Responsiveness to the Build.

Collapse
 
somanathgoudar profile image
Somanath Goudar

Thank you, Yes, will work on the responsiveness of the build 👍

Collapse
 
mafee6 profile image
Mafee7

Wow

Collapse
 
aalphaindia profile image
Pawan Pawar

Good one!!

Collapse
 
somanathgoudar profile image
Somanath Goudar

Thank You! Glad you liked it

Collapse
 
mafee6 profile image
Mafee7

Looks Exactly Like Youtube, Add Dark Theme

Collapse
 
somanathgoudar profile image
Somanath Goudar

Yeah 😍

Collapse
 
kr4idle profile image
Pete Steven

Nice, looks very much like youtube.

You could also try a nocode tool like Desech Studio to work on the html/css visually, instead of writing it by hand.

Collapse
 
muhammadraihan27 profile image
Muhammad Raihan

where do you get this img??, i also want to clone more app, but i dont have img(image). please give information to get img from more app. am in indonesia

Collapse
 
cardnadra profile image
Nadra Card Centre

Can you make this demo workable template for blogspot including embed iframe link bro?