How To Make Netflix Website Clone Using HTML And CSS

Sdílet
Vložit
  • čas přidán 16. 12. 2022
  • Learn How To Make Netflix Website Clone Using HTML And CSS
    ❤️ SUBSCRIBE: goo.gl/tTFmPb
    This this video you will learn to create Netflix landing page clone using HTML and CSS. This website design will be completely responsive for laptop and mobile devices.
    Download Image: drive.google.com/file/d/1rjxW...
    #htmlandcss #website #websitedesign
    -----------------------------------------
    Suggested Course:
    ❤️ Complete website Using HTML and CSS
    ✔️ 8 Complete website step by step
    ✔️ Source Code Download
    ✔️ 76 Lectures, 12 Hours Video
    ✔️ Course Completion certificate
    👉 easytutorialspro.com/go/course/
    -------------------------------------
    Recommended Videos:
    Learn Complete HTML and CSS from basics:
    ► • HTML And CSS Tutorial ...
    Make A Complete Website for college using HTML & CSS:
    ► • How To Make A College ...
    How to make a Business website step by step:
    ► • How To Make Website Us...
    How to make personal resume website step by step:
    ► • How To Make A Website ...
    How to make fitness website design using HTML CSS:
    ► • How To Make A Website ...
    How to make an Ecommerce Website Design:
    ► • How To Make eCommerce ...
    How to make a Job Portal website design with HTML & CSS:
    ► • How To Make Website Us...
    How to make travel website design with HTML CSS Bootstrap:
    ► • How To Make A Website ...
    -------------------------------------
    Affordable web hosting (coupon- EASYTUTORIALS)
    👉 easytutorialspro.com/hosting/
    My recommended tools and tutorials
    👉 easytutorialspro.com/
    -------------------------------------
    ◼️ Source code link is shared in community post for all my coding videos exclusively for channel members (only channel members can see)
    Join Channel Membership:
    ► / @greatstackdev
    -------------------------------------
    Images Credit:
    www.netflix.com/in/
    -------------------------------------
    Like - Follow & Subscribe us:
    ◼️ CZcams: goo.gl/tTFmPb
    ◼️ Facebook: goo.gl/qv7tEQ
    ◼️ Twitter: / itsavinashkr
    ◼️ Instagram: / iamavinashkr

Komentáře • 286

  • @jhashashwatkumar
    @jhashashwatkumar Před rokem +131

    Yesterday I have done this project without any tutorials. What a coincidence..❤️

  • @theotheluo6546
    @theotheluo6546 Před rokem +14

    This is one of the best tutorial channels in youtube. Concepts are explained in a way that is easy to understand. Keep up the good work sir.

  • @amydd8506
    @amydd8506 Před rokem +44

    I m working your every project from begining step by step and then craeting my own with what I ve learned by your material. Thank you so much !!! I m learning a lot step by step !! God bless you !!! Thank you for sharing all of this with us ❣🙏

    • @GreatStackDev
      @GreatStackDev  Před rokem +5

      Thank amy, we will be making more projects like this

    • @marcoantoniovalencia8694
      @marcoantoniovalencia8694 Před rokem +1

      @@GreatStackDev Your videos are great, but it would be great if you implemented BEM methodology for the CSS to have a clearer code

  • @learnonline7651
    @learnonline7651 Před 10 měsíci +4

    you are a great teacher for us .. May Allah gives you a long live .. love from Bangladesh💖💖💖

  • @aadrikasingh5004
    @aadrikasingh5004 Před rokem +6

    Literally for the first time I was able to follow a tutorial and complete it till the very end. Thankyou!!!

    • @ritikamundhra4
      @ritikamundhra4 Před 10 měsíci

      Heyy I have a request to make. Can you reply?

  • @Proudly_indiann
    @Proudly_indiann Před rokem

    thank you for providing such good content in a simpler way...

  • @RohanDas-qz6bj
    @RohanDas-qz6bj Před rokem +1

    Thank You For this beautiful Netflix clone project.

  • @spideygaming5103
    @spideygaming5103 Před rokem

    Thank you so much ❤ i have learnt a lot from this tutorial

  • @shreelekham.k.9141
    @shreelekham.k.9141 Před 7 měsíci

    I completed this project, thank you so much sir😊

  • @tatashyam
    @tatashyam Před rokem +1

    Wonderful explanation Thank you Easy Tutorials. Step by step explanation is very good. I am practicing this layout now.

  • @CherryMakesGameplays
    @CherryMakesGameplays Před měsícem

    Tried many tutorials but only yours worked for me

  • @user-gv8jn6de2r
    @user-gv8jn6de2r Před rokem

    Thank you! I'm learning a lot

  • @Brogrammer2929
    @Brogrammer2929 Před rokem

    wonderfull presentation .can understand very easily

  • @dhanya30
    @dhanya30 Před rokem +1

    Really..this project is awesome...💯

  • @CodewithAbdullahNahian

    I truly love your channel. Keep doing the best work.

  • @HaiTran-su8ow
    @HaiTran-su8ow Před rokem

    Big fan of you from Vietnam😍

  • @ayushayush4608
    @ayushayush4608 Před rokem

    Amazing brother and thank you🎉❤

  • @Nanashi-rq7lk
    @Nanashi-rq7lk Před 10 měsíci

    Perfect Tutorial. Thanks

  • @yeshwanth2910
    @yeshwanth2910 Před rokem

    Nice video and great explanation.......Thanks dude!

  • @T7771k
    @T7771k Před rokem +7

    Thank you so much I had made that in my code editior step by step I had saw a website as your clone website very perfect in big-screen and small-screen also.Very clean tutorials. Keep it up

  • @MilanSisara-id8vv
    @MilanSisara-id8vv Před 10 měsíci

    Lots of Love From Gujarat🥰🥰🥰🥰🥰

  • @asadshaikh7281
    @asadshaikh7281 Před rokem

    You are my favorite bro..thank you so much

  • @kelle_li
    @kelle_li Před rokem +5

    This is an incredible tutorial/clone video, I learnt a great deal from it thank you. Just curious how did you get the background image and other images? I want to try and clone the UK version which has a 'Who's Watching?' screen with the personal profile icons, how can I get them? Thanks.

  • @sethukarasisethu6491
    @sethukarasisethu6491 Před rokem

    You deserve this👑 !!!

  • @rorschach2892
    @rorschach2892 Před 10 měsíci

    Thank you for this, you make frontend easier for beginners, hugs from Brazil

  • @karthikkarthi9893
    @karthikkarthi9893 Před 4 měsíci

    Sir I can easily understand your coding 😊

  • @pakhawaj_omkar
    @pakhawaj_omkar Před rokem

    Amazing Tutorial Thank You Sir

  • @Tmaks_zw
    @Tmaks_zw Před rokem

    The first channel i felt like the like and subscribe button are not enough

  • @pienodisentimento5187
    @pienodisentimento5187 Před 2 měsíci +1

    Thank you so much! Best tutorial and a time saver.

    • @GreatStackDev
      @GreatStackDev  Před 2 měsíci

      Glad you liked it. Thanks for your comment. 😊

  • @learnwithnagma
    @learnwithnagma Před 4 měsíci

    Thank you so much 😊.

  • @muneesh143
    @muneesh143 Před 7 měsíci

    this video are so helpful ho boomup🤩🤩🤩🤩

  • @Gato.Samurai
    @Gato.Samurai Před rokem +2

    You´re the best my brother. Thank you ❤

  • @Supriya-bi3fk
    @Supriya-bi3fk Před 4 měsíci

    Thanks sir iam very helpful 🎉

  • @harishsundaram6579
    @harishsundaram6579 Před 6 měsíci +1

    Thankyou so much sir....

  • @gandamraviteja7019
    @gandamraviteja7019 Před 3 měsíci

    Amazing work hats off to you
    Even paid courses will not give this much knowledge and explanations
    Thank you so much for this course

    • @sahilgumber7
      @sahilgumber7 Před 3 měsíci +1

      Bhai agr tera perfectly responsive h toh ek br code share krde please

    • @gandamraviteja7019
      @gandamraviteja7019 Před 3 měsíci

      @@sahilgumber7 sure I will share my github link here

  • @ShubhamSharma-ne8rp
    @ShubhamSharma-ne8rp Před rokem

    thank you i learn alot from this video.....

  • @user-cg7es3ec7n
    @user-cg7es3ec7n Před rokem +2

    Bro I love your tutorial but where is the part where you saved HTML and CSS file? Anyways great tutorial and well done for your hard work

  • @youtubersreaction5731
    @youtubersreaction5731 Před rokem +1

    Thank you so much

  • @KameshE-rj6fg
    @KameshE-rj6fg Před rokem

    Thank you so much sir!!!!

  • @imposter1069
    @imposter1069 Před rokem

    Thank youuu soo much 😍

  • @fifaworldcupwatch
    @fifaworldcupwatch Před 9 měsíci

    Your voice is so smooth and your language is easy to understand. Take love form Bangladesh

  • @CodeCreative1
    @CodeCreative1 Před rokem

    Looks dope!

  • @vamsivignesh2727
    @vamsivignesh2727 Před rokem +2

    Brother can you make the same concept videos by using react js.
    I learned so many things from your video on how to use visual studio code properly.
    Please make a plan to make a video on react js. It's very helpful for my future interviews thank you, brother......

    • @duttachandan8372
      @duttachandan8372 Před 10 měsíci

      Follow the same instructions but there is a catch you will have to use JSX instead of HTML code, and the other part is for the repeated part try creating API, so that way u don't need to repeat your code again and again.

  • @youremotions5910
    @youremotions5910 Před rokem

    thanks for this please create full website clone

  • @justiceokoroafor
    @justiceokoroafor Před rokem

    Good evening,I really love your work so far. Thanks for sharing all you have do e so far. Please, while adding google fonts on my weppage, when I refresh the page the texts shakes, and it happens on icons too

    • @GreatStackDev
      @GreatStackDev  Před rokem

      I think you are using VS code liver server, Please check the webpage without live server

  • @abhisaragarwal9084
    @abhisaragarwal9084 Před rokem +2

    The tutorial was a great one but i used check box as input type so that the accordion content can be hidden again after clicking on cross

    • @sripriyansvbsbtskanchibhat9152
      @sripriyansvbsbtskanchibhat9152 Před rokem

      please share how you have done it

    • @honeyjakundiya
      @honeyjakundiya Před rokem +3

      @@sripriyansvbsbtskanchibhat9152 just replace "radio" with "checkbox".
      -------HTML--------
      (Change for all 6 ids)
      -------CSS--------
      input[type="checkbox"]
      .accordion input[type="checkbox"]:checked + label + .content
      .accordion input[type="checkbox"]:checked + label::after

  • @vikramdp505
    @vikramdp505 Před 10 měsíci +1

    thankyou man!!!!!!

  • @mikenance4713
    @mikenance4713 Před 7 měsíci +1

    When you begin to clone a website , how do you go about finding the appropriate CSS dimensions , sizes, padding, color, etc... is it somewhere we can look that up on the original website?

  • @mathiasonyebuchi4163
    @mathiasonyebuchi4163 Před 9 měsíci

    Sir I have a question but before my question I have to say this tutorial was very helpful for me as an upcoming web developer, so my questions is my email bar in the bearded content doesn’t stay in Ig’s right position when I switch to other display like smaller devices in the content I don’t really
    Know what’s wrong 😊

  • @oshegbecomedies
    @oshegbecomedies Před 11 měsíci +1

    Sir, thank you so much for this amazing tutorial. I don’t know how find the icon on sign in navigation, pls help...

  • @santoshthakurgamin
    @santoshthakurgamin Před rokem

    Humble request to make it full series!

  • @drexex0f
    @drexex0f Před 3 měsíci +2

    these Frontend developer thinks cloning means only the UI portion. the main thing is that more than UI backend is more complex and cool about these big applications like netflix amazon

  • @nishantpandey1042
    @nishantpandey1042 Před 6 měsíci

    Thanks You🎉

  • @matrixnft
    @matrixnft Před rokem +1

    Done Thank you❤

  • @divya.n1697
    @divya.n1697 Před 5 měsíci

    This is really great - Had one question- how to modify code where the radio button is pressed again and contents should collapse and hide ( on original site this feature was visible). But couldn't get through to that. Can you help ?

  • @Kratos0223
    @Kratos0223 Před 10 měsíci

    Thank you so much. Really good video.

  • @santoshthakurgamin
    @santoshthakurgamin Před rokem +1

    Sir continue this series make it full stack website how to make that monitor video moving.

  • @perverturga1574
    @perverturga1574 Před 9 měsíci

    thank you

  • @user-zg9sz6hh4n
    @user-zg9sz6hh4n Před 7 měsíci

    Best ❤

  • @Batman_22k
    @Batman_22k Před rokem

    Please make a video about how to create website like CBR, ScreenRant.

  • @praneshwar9992
    @praneshwar9992 Před 6 měsíci

    very useful

  • @HafsaAkhter-dh9vc
    @HafsaAkhter-dh9vc Před rokem

    very helpful video

  • @akramaici6499
    @akramaici6499 Před 11 měsíci

    i have question when we use css media we dont use break-points for différentes sizes

  • @sapnabhatt6892
    @sapnabhatt6892 Před rokem

    nice😊

  • @princearya4208
    @princearya4208 Před rokem +1

    can you make sign in signup usable and the video homescreen interface for netflix in part -2

  • @parvdeepsingh13
    @parvdeepsingh13 Před 11 měsíci

    Hello, I am facing little difficulties in the footer section so I can get a github repo link so that I can cross check.

  • @mdms4549
    @mdms4549 Před rokem

    Very Awesome

  • @PavanPcLab
    @PavanPcLab Před 8 měsíci

    thanks for the download link man i watch many video but no one is giving the link of image i am watching this video after 11 ,12 months and there is some changes in the original website and it is obvious and as a new person it is difficult with some changes and difficult to download the images

  • @jhashashwatkumar
    @jhashashwatkumar Před rokem

    Please make a tutorial for Disney+ Hotstar clone 👍

  • @mosesnjoroge5639
    @mosesnjoroge5639 Před rokem +1

    can you in future consider having a split screen?

  • @wardahaibe7691
    @wardahaibe7691 Před 9 měsíci

    thnks alot

  • @papasmurf3202
    @papasmurf3202 Před rokem

    Hello..do one for fetching animes...

  • @dabezt1379
    @dabezt1379 Před rokem +1

    nice tutorial,,but why use button instead of select option,,

  • @shreyaagrawal9689
    @shreyaagrawal9689 Před 11 měsíci

    how had you edited the background image of 2, 3, 4 slides down the first page??

  • @siddharthi3161
    @siddharthi3161 Před 10 měsíci +2

    I saw this video on 28/09/2023 and completed half and kept half for the next day. The next day (September 29, 2023), Netflix updated their website. So, it's different from the official website now. 🥴🥴🥴🥴🥴

  • @Ikram0259
    @Ikram0259 Před 9 měsíci

    I have a question, where did you get the pictures and what about copyright? Because I need some Netflix show posters but I can’t find any without copyright 😭

  • @anwaremehemai9495
    @anwaremehemai9495 Před rokem +1

    thanks

  • @ziaorahman7030
    @ziaorahman7030 Před rokem

    Easy tutorial is a great channel and very helpful
    Bro I want consult with you one to one session. If you have online slot I will book appointment for zoom meeting please.

    • @GreatStackDev
      @GreatStackDev  Před rokem

      Thanks Ziao, I just make tutorials on CZcams, I don't take any online session

  • @Abhinaw_singh3549
    @Abhinaw_singh3549 Před rokem +3

    bro you have told us how to open faq questions but not told how to close it?

  • @aforangular3759
    @aforangular3759 Před rokem

    Great sir

    • @GreatStackDev
      @GreatStackDev  Před rokem

      thank you, Glad you like this website design tutorial

  • @retromusichall7517
    @retromusichall7517 Před 9 měsíci

    GRACIAS por tan buen tutorial,como podria conseguir el codigo fuente,saludos desde mexico.

  • @user-sd5gw6bj5o
    @user-sd5gw6bj5o Před 6 měsíci +2

    i am having trouble pls help me
    no proper back ground image fix

    • @AdarshKumar-vt7wc
      @AdarshKumar-vt7wc Před 22 dny

      background-image: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)),
      url("images/header-image.png"); //use this line instead

  • @mr_affan15
    @mr_affan15 Před 6 měsíci +1

    Thank bro for accordion but individual accordion must be close after tap

  • @bhanukamlay8209
    @bhanukamlay8209 Před 10 měsíci

    From which website you took that tv trasparent image

  • @sunil_ooo1
    @sunil_ooo1 Před rokem

    Nice sir

  • @focusreflect8223
    @focusreflect8223 Před 3 měsíci +1

    Guys can someone help me... I know html and css but when i start doing a project i get suck in bringing the text in the center.. even after using justify-context and align-items..🙏

    • @as01331
      @as01331 Před 2 dny +1

      For Making The Text Go Center, Use Text-align property and give it's value to center.

  • @orien1116
    @orien1116 Před 6 měsíci

    sir you provided checked option for faq but if we want to click again there is no unchecked option??

  • @gurdeepmetai970
    @gurdeepmetai970 Před rokem

    Can you please help me with how Netflix is placed away from starting point and the sing-in button is placed away from the ending point equally and how other content is starting from exact bottom of Netflix logo not from the screen starting point?

    • @SAM-tw4wd
      @SAM-tw4wd Před rokem

      Bhai un sb ko phele se ek container me krdia hoga aur us container ko margin dedia hoga sides se mene to ese hi kra tha apne project me

  • @quintonnyakundi
    @quintonnyakundi Před rokem

    is it possible to make a League of Legends website I kind of love it

  • @SOKHAN
    @SOKHAN Před rokem

    How to use the code for Blogger templates .?

  • @mdsaifullah6305
    @mdsaifullah6305 Před rokem

    i want to tailwindcss project class. Please🙏 give this video 🙏of tailwind css

  • @muhammadbinbazz
    @muhammadbinbazz Před rokem

    Guide Me Please Sir, the web preview is just showing the style.css Commands why pls

  • @Gvloves
    @Gvloves Před 9 měsíci +1

    I am following your steps but background image is not reflecting in output

  • @rahulmourya6938
    @rahulmourya6938 Před 6 měsíci

    We can make this clone using only html and css only?

  • @johntbouli3189
    @johntbouli3189 Před rokem +1

    how do have hr elements dividing the sections of the page without coding the hr element in the html

    • @GreatStackDev
      @GreatStackDev  Před rokem +1

      you are talking about dividing like at before footer section. that is made using CSS
      border-top: 6px solid #333;

  • @lostlove3392
    @lostlove3392 Před měsícem

    Use checkbox instead of radio for Faqs

  • @archanabelal6958
    @archanabelal6958 Před 10 měsíci

    Iam facing difficulty in faq section. When i click on the question it is not displaying answer. What may be the reason?

  • @deepikadeepu3245
    @deepikadeepu3245 Před rokem +1

    Bro....which backend language you have used...

  • @sarthakrathore5433
    @sarthakrathore5433 Před 3 měsíci +2

    Sir where is source code..

  • @user-mp1tw2wt2p
    @user-mp1tw2wt2p Před 9 měsíci +1

    i am having issues with the url tag, the header image wont show up . i cant find a solution. i'd be glad if someone can help
    🥺