Create Responsive Website with Login & Registration Form | HTML CSS and JavaScript

Sdílet
Vložit
  • čas přidán 25. 08. 2024
  • In the video, I demonstrate how to make a responsive website with a login and registration form using HTML, CSS, and JavaScript. The website features a navigation menu at the top with a login button. When clicked, the login form appears as a popup with a blurry background effect. You can easily switch between the login and registration forms by clicking the provided link.
    🖼️ Get Only Images of this Website with Login & Signup Form
    ➤ www.codingnepa...
    🗂️ Get Source Code of this Website with Login & Signup Form
    ➤ buymeacoffee.c...
    🌐 Visit CodingNepal for helpful coding projects
    ➤ www.codingnepa...
    ⭐ Hire me on Fiverr
    ➤ www.fiverr.com...
    📷 Follow me on Instagram
    ➤ / coding.np
    🤝 Support my work with a coffee
    ➤ buymeacoffee.c...
    Timestamps:
    0:00: Website Forms Demo
    1:35: Starting with HTML & CSS
    1:50: Creating the Navigation Bar
    7:13: Creating the Popup Login Form
    19:35: Creating the Popup Registration Form
    24:18: Making Forms Responsive
    25:50: Toggling Form Popups on Click
    29:10: Switching between Login and Registration
    32:27: Making Navigation Bar Responsive
    #html #css #website #login #register
    Music Credit:
    Ikson - We Are Free [Official]
    • #83 We Are Free (Offic...
    LAKEY INSPIRED - Chill Day
    • LAKEY INSPIRED - Chill...
    After Rain - Zackross
    • After Rain - Zackross ...
    Miss You - LiQWYD
    • Miss You - LiQWYD (No ...

Komentáře • 61

  • @soundofheaven1190
    @soundofheaven1190 Před rokem +3

    To be honest you are the best for beginners. Thank you so much. Hope we will gets more from you

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

    Thank you so much, your work is appreciated. You are helping so many people out there.

  • @Fafy-Kids
    @Fafy-Kids Před 3 měsíci

    thank you pal , I tried with you step by step in 2024... still effective

  • @64_bit_coding
    @64_bit_coding Před rokem +8

    This is the first time I haven't seen you use Poppins font. Also congrats on 200K subscribers

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

    Best channel for beginners 🎉

  • @dgpreston5593
    @dgpreston5593 Před rokem +1

    🎧 on...
    Actually said "oh, wow" @29:59
    Highly entertaining. Love the format and content.
    Didn't subscribe immediately, was mesmerized...
    😢😅

  • @coding567
    @coding567 Před rokem +1

    It's so useful Congratultions for 200k😍😍

  • @javascriptcoder-pf9hh
    @javascriptcoder-pf9hh Před rokem +1

    Can always count on you to bring the best content 😊

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

    thank you broo you are code is usefull for every one ...love u brooooo

  • @ShivamSingh-se4hl
    @ShivamSingh-se4hl Před 9 měsíci

    Thank You for Great content. Please also make a video on how to connect this to a database so that we can use it in real life websites.

  • @maheshvaishnav727
    @maheshvaishnav727 Před rokem

    love from maharashtra bro ❤

  • @yubiroaster6285
    @yubiroaster6285 Před rokem

    Such an amazing and useful video.❤ Thank you so much, sir.🙏

  • @user-hc9fv1ju7v
    @user-hc9fv1ju7v Před 11 měsíci +3

    Thank you for the great content! Maybe it will be useful if you add some text pop-ups with small explanation for difficult moments in the video (for better understanding for what current action is needed)

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

    It's so useful🥰

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

    i like your video, i like your channel

  • @codingcinemax
    @codingcinemax Před rokem

    Congratulations for 200K 🎈🎉

  • @priyanshu_._
    @priyanshu_._ Před rokem

    Thank you for this:)
    It would be really helpful if you bring a part of 2 of storing it in Data Base.

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

      Thanks for the idea!

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

      🤧 learn nodejs with any database like mongodb or firebase , or else you can use firebase only but you need banger js knowledge

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

    Thanks alot

  • @SOUMYABANERJEE-hq9wl
    @SOUMYABANERJEE-hq9wl Před 3 měsíci

    Where did you construct the class "show-popup"??

  • @comwia
    @comwia Před rokem

    thanks

  • @mdms4549
    @mdms4549 Před rokem

    Thank you brother, I really enjoyed this video
    Please, if possible, use the topic of form validation in other videos
    Thanks

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

      Sure I will

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

      @@CodingNepal Thank you my friend🙏🙏

  • @ichsanadi1186
    @ichsanadi1186 Před rokem +1

    Its cool but how to get background animation in login page?

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

    Bro I’m having issues please help the padding and height stopped having effect after line 107 it’s really tiring😢

  • @officialquotes1113
    @officialquotes1113 Před rokem

    make a tutorial on how to make a blogger template please 🙂🙏

  • @ZAFARGURMANI
    @ZAFARGURMANI Před 11 měsíci +2

    "Why do your Fiverr ratings and order count not match your impressive skills? Do you freelance alongside a job?"

  • @DivyaGhadge-fb7mh
    @DivyaGhadge-fb7mh Před 8 měsíci

    Hi mam I don't understand that how to join sign up form

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

    why are you using px instead of vh or vw?

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

    👌

  • @jokamanagementteam
    @jokamanagementteam Před rokem

    Please do you know any other language apart from html,css,js and php?

  • @t_trar2158
    @t_trar2158 Před 5 měsíci

    Is there tutorial teaching how to handle wrong username or password situation?

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

    I follow the same method but there is no styling

  • @AnishKumar-ku7tn
    @AnishKumar-ku7tn Před rokem

    From where you have learned CSS

  • @Coded-jj7fm
    @Coded-jj7fm Před 2 měsíci

    Sir, I am not getting the same output, what should I do?

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

      Double check your codes with me or get codes from here www.codingnepalweb.com/create-website-login-registration-form-html/

    • @Coded-jj7fm
      @Coded-jj7fm Před měsícem

      @@CodingNepal ok

  • @Bagiragaming78
    @Bagiragaming78 Před rokem

    Javascript ko chuttai course lera awnus na please from beginner to advance nepali ma ani website ma real use kata hunxa tyo pani vandinu like logic building

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

    Is that a localstorage ??

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

      What do you mean by local storage?

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

    please sir create a reffaral system using php my sql continue your login and registration system with email otp verification playlist

  • @mdms4549
    @mdms4549 Před rokem

    😊😊😉🙏🙏

  • @piggymaster3209
    @piggymaster3209 Před rokem

    26:00

  • @piggymaster3209
    @piggymaster3209 Před rokem

    7:19

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

    i want source code ,how i get?

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

      Here is the source code www.codingnepalweb.com/create-website-login-registration-form-html/

  • @skanderlandolsi6182
    @skanderlandolsi6182 Před 5 měsíci

    thx for the video , can i get the source code ?

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

      Here is the source code www.codingnepalweb.com/create-website-login-registration-form-html/

  • @tsunami100
    @tsunami100 Před rokem

    Bhai muh se sath sath bol kr bhi samjhaya kro