How to Build Responsive Netflix Clone using HTML and CSS - Beginners Tutorial

Поделиться
HTML-код
  • Опубликовано: 20 сен 2024

Комментарии • 105

  • @fridaee
    @fridaee Год назад +6

    you are so amazing, I just installed VSC with extremely little knowledge about it and could easily follow along! Great work!

  • @shaiksuraj6017
    @shaiksuraj6017 Год назад +2

    I have done my internship on web development thankyou 💜

    • @sirishayatham1810
      @sirishayatham1810 11 месяцев назад

      How can I download images and videos to insert in code... Iam not getting it perfectly while I am downloading..

  • @Harshitmahour
    @Harshitmahour 3 года назад +5

    Brother i really like this. By your explanation this looks easy to me as a Html & Css beginner. ❤

    • @FutureCoders
      @FutureCoders  3 года назад +1

      I am glad to hear that! And glad it helped you. Thank you ❤️

    • @Harshitmahour
      @Harshitmahour 3 года назад

      @@FutureCoders and i am also learning javascript from your tutorials. Short and to the point amazing!!!

    • @FutureCoders
      @FutureCoders  3 года назад +1

      @@Harshitmahour Thank you! It means a lot to me ❤️.
      Will be uploading tutorial on twitter clone today in the evening. Stay tuned 😉

    • @saitejavasamsetti1928
      @saitejavasamsetti1928 11 месяцев назад

      send the code

  • @RAJ-xp9tp
    @RAJ-xp9tp Год назад +1

    the display :flex not working .the images are still vertical

    • @kodiallen3
      @kodiallen3 Год назад

      same here

    • @kodiallen3
      @kodiallen3 Год назад

      I just figured it out! make sure in the selector you are using "posters" not "poster" i was just forgetting the "s" simple typo

  • @sirivelichannel0819
    @sirivelichannel0819 Год назад

    Thanks a lot bro🎉🎉🎉🎉🎉🎉🎉
    After a long time of search I got your video as a god gift for creating website.
    Once again thanks a lot bro❤❤❤

  • @Saiprasad22
    @Saiprasad22 Год назад

    Just Amazing bro. Thanks a lot

  • @oneeritrea
    @oneeritrea 3 года назад +1

    could you please suggest to me any video you make in the CSS grid? THANK YOU. KEEP THE GREAT WORK!!!!

    • @FutureCoders
      @FutureCoders  3 года назад +3

      Thank You! Sorry! Currently I don't have any videos on CSS Grid. There is an amazing channel of " Kevin Powell " ( Search on RUclips ). He might have videos on Grid.

  • @mauricioreguete466
    @mauricioreguete466 3 месяца назад

    Obrigado por essa aula incrível...

  • @Samaelh12
    @Samaelh12 2 года назад

    i love it. ty too much. grettings from México

  • @antusaha6278
    @antusaha6278 Год назад

    just finished my first web page,thanks man

    • @FutureCoders
      @FutureCoders  Год назад

      Wow! Congratulations on your first web page. Keep going

    • @antusaha6278
      @antusaha6278 Год назад

      @@FutureCoders 😌❤️

  • @MMMMMM-kh2iy
    @MMMMMM-kh2iy 2 года назад

    you are amazing brother. Thank you so muchh !!!!!!!

  • @playwithvayofficial
    @playwithvayofficial 3 года назад +12

    For 08:00 in, there is actually an emmet shortcut for selecting all class names at once and removing on Windows:
    Ctrl + Alt + Down Key
    Hope that helps!
    Great video once again :) This project was a great refresher for my CSS skills.

  • @gabrielcouto4356
    @gabrielcouto4356 2 года назад +1

    Fantastic, thank very much

  • @salehalshemali2419
    @salehalshemali2419 Год назад

    Nice Video nice explain

  • @Gshadow0
    @Gshadow0 Год назад

    This is fire 🔥🔥🔥🔥🔥

  • @35_pranotisarjoshi_2b6
    @35_pranotisarjoshi_2b6 Год назад

    Sir image got so small after linking CSS .... Not even visible

  • @StaticBlaster
    @StaticBlaster Год назад

    I added your video to my computer tutorials playlist. I definitely will be building this project so that I can learn more about html, CSS and JavaScript. Tutorials are boring but learning in the form of building something like a responsive website or app is more of a valuable way to learn. Real world projects beat out boring tutorials.

  • @shehryaransari8353
    @shehryaransari8353 7 месяцев назад

    sir apny sarri images nhi dea hn jitne apny use kiyen hn isme sir please ap sarri images ka link send kr den please sir

  • @khamismazrui701
    @khamismazrui701 7 месяцев назад

    will it be playing movies like netflix

  • @ishan1127
    @ishan1127 2 года назад

    Brother can you tell us how to add scroll buttons(arrows) on left and right sides. So that we can navigate the movies.

    • @FutureCoders
      @FutureCoders  2 года назад

      You can use swiper for adding scroll arrows. Search for swiper they have an easy documentation.

  • @Pokemon_Toons
    @Pokemon_Toons 2 года назад

    really perfect

  • @User74773
    @User74773 2 года назад +1

    by the way how do you scroll horizontally through the movies? i cant find out what i use to scroll through them

  • @N3n3games
    @N3n3games 3 года назад +1

    were are the images

  • @oscarjonathangrancianososa5493
    @oscarjonathangrancianososa5493 2 года назад

    Eres un capo bro

  • @sprita8114
    @sprita8114 2 года назад

    the black navigation bar isnt working for me i followed and recopied the same code

    • @FutureCoders
      @FutureCoders  2 года назад

      console log something in js file when we trigger the scroll functionality

  • @sharmilaojha4146
    @sharmilaojha4146 2 года назад

    Tomorrow is my presentation..please reply asap sir

  • @apej
    @apej 2 года назад

    I got a problem with the styling, the buttons length is almost like the whole page . Even tho i followed everthing carefully i still got this problem and when i move my mouse to the buttons there is no hovee or anything

    • @shreya3429
      @shreya3429 2 года назад

      Even I am facing the same problem. Did you find some solution?

    • @magedabdulaziz3467
      @magedabdulaziz3467 Год назад

      check the classes again

  • @ciprianmoldovan
    @ciprianmoldovan 2 года назад

    How can I link pages to the film images?

  • @_theshashwat_
    @_theshashwat_ 3 года назад

    Nice ❤️❤️❤️

  • @emmanuellakosyogbu966
    @emmanuellakosyogbu966 2 года назад

    Please the last phase where the script was introduced seems not to working , I want to know what I may be doing wrong

    • @FutureCoders
      @FutureCoders  2 года назад

      compare your script with mine. If still facing problem. Paste here your code which is inside script. Will take a look.

  • @gamerspk5425
    @gamerspk5425 Год назад

    How do I link to another html page when clicking on the series to go to a page of the clicked series itself ????????

    • @FutureCoders
      @FutureCoders  Год назад

      For that to work. you need to specify an id for each series. so when you click on that series. you can navigate to that series page

  • @hefshineganeshkamble6364
    @hefshineganeshkamble6364 Год назад

    i code same as like u but u r output and my output will be different

  • @s.joseph4838
    @s.joseph4838 Месяц назад +1

    What the point when you can't play this or bring this alive smh,

  • @jameelhadi9462
    @jameelhadi9462 Год назад

    You r best because you provided all things source code and images

  • @sunshinebernardo530
    @sunshinebernardo530 2 года назад

    the gradient isn't working to me, i checked your coding and my coding a lot of times but it's still not working, can you pls help me?

    • @FutureCoders
      @FutureCoders  2 года назад

      check whether u have selected the correct element for the gradient.
      .banner--fadeBottom {
      margin-top: 145px;
      height: 7.4rem;
      background-image: linear-gradient(180deg, transparent, rgba(37, 37, 37, 0.61), #111);
      }

    • @arontapolcai2937
      @arontapolcai2937 2 года назад

      try writing fadebottom in lower case. It helped me

  • @nimrahhere
    @nimrahhere Год назад

    how to make it responsive ?

  • @sonaldeepkaur9063
    @sonaldeepkaur9063 2 года назад

    My css is not connecting to HTML please help

    • @FutureCoders
      @FutureCoders  2 года назад

      Check if your css file is in same file as index.html file. Also check if you have spelled name of the css file correctly

  • @ashfaqmohammed7558
    @ashfaqmohammed7558 3 года назад

    your explanation really good , thank you

  • @sharmilaojha4146
    @sharmilaojha4146 2 года назад

    Sir am getting some problems..can you help me please 🥺🥺🥺..

  • @letranhieu1109
    @letranhieu1109 2 года назад

    I can't scroll on posters

  • @User74773
    @User74773 2 года назад +1

    29:22

  • @N3n3games
    @N3n3games 3 года назад

    pls were are the images in the discribtion box

    • @FutureCoders
      @FutureCoders  3 года назад +1

      Just Added Them! Check Description box again

    • @N3n3games
      @N3n3games 3 года назад

      @@FutureCoders thnx

  • @SoniInterio
    @SoniInterio Год назад

    How to public website like this?

    • @FutureCoders
      @FutureCoders  Год назад

      You mean how to host the website?

    • @SoniInterio
      @SoniInterio Год назад

      @@FutureCoders yes

    • @FutureCoders
      @FutureCoders  Год назад

      You can use github pages, netlify to host it for free

  • @gurupritsingh3991
    @gurupritsingh3991 Год назад

    Hello Sir @FutureCoders
    The below property is not working. i mean after scroll bar is hidden, it is not moving. Please assist me with this
    .poster::-webkit-scrollbar{
    display: none;
    }
    thanks

    • @FutureCoders
      @FutureCoders  Год назад

      it should be applied to the row__posters which is the parent which contains all the posters

  • @sonaldeepkaur9063
    @sonaldeepkaur9063 2 года назад

    Bro can we import our images??

  • @its_shinde96k
    @its_shinde96k 2 года назад

    Free chalta hai kya

  • @yasaratalay6137
    @yasaratalay6137 2 года назад +1

    Can you make it with boostrap 4 please :)

  • @raginisachan9550
    @raginisachan9550 3 года назад

    Bro this is only front end build back end too

    • @FutureCoders
      @FutureCoders  3 года назад +4

      Yes it's an HTML and CSS tutorial. Backend tutorial coming soon

    • @raginisachan9550
      @raginisachan9550 3 года назад +1

      Ok

    • @dendyarwana5498
      @dendyarwana5498 3 года назад

      @@FutureCoders Hi sir, Yeah! can wait full clone netflix from zero to online and im done buy ur Source Code Good.. btw u have contact i can sharing.. i need input for make streaming website like netflix thanks sir

    • @Arabian_Abomination
      @Arabian_Abomination 2 года назад +1

      I am planning to make a full stack course on Netflix build in JS 🎉🔥

    • @dendyarwana5498
      @dendyarwana5498 2 года назад

      @@Arabian_Abomination i want this sir.. really build web like netflix from zero to finish? How..

  • @AshishSharma-xf6zp
    @AshishSharma-xf6zp Год назад

    Bro the javascript not working

  • @albertambila9868
    @albertambila9868 3 года назад

    Hi I need your services

    • @GauravKumar-ue7nz
      @GauravKumar-ue7nz 3 года назад

      If you have Html Css works, I can do it fast and with quality for you.