Professional Website From Scratch | HTML & CSS For Beginners

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

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

  • @pythonantole9892
    @pythonantole9892 Год назад +156

    Brad is one of the few web dev teachers that has love for newbies and beginners. Kudos Brad!

    • @TraversyMedia
      @TraversyMedia  Год назад +64

      These tutorials are their introduction to this whole world. I try as best as I can to explain things in a simple way and teach real-life skills. Seasoned devs can follow any tutorial, docs, articles but beginners need things presented in a certain way imo. Also, I learn so many different areas that I am always a beginner in something. So I know how it feels and understand how to convey things in that way.

    • @AvidAfrican
      @AvidAfrican Год назад +4

      With Him i build my first and second HTML and CSS based website....

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

      Straight facts

    • @ভোমরা
      @ভোমরা Год назад +2

      Google Bard

  • @webdevluc
    @webdevluc Год назад +23

    Great design and love the fact that it's vanilla CSS. These full project videos from design to code are the best to learn from. Thanks for sharing this for free Brad

  • @codingshare9973
    @codingshare9973 Год назад +3

    I just wanna thank Traversy Media
    I've been learning from Traversy Media since 2018 unti now
    now I am a Senior Back End Dev in a company
    thanks for your quality teaching

  • @nimira43
    @nimira43 Год назад +4

    Brad is the best coding teacher and instructor who is engaging, informative and whose approach is no nonsense and straight to the point. I'm a student of his courses on his website and Udemy and anyone who is serious about coding MUST check those out, in particular his own website. Thanks Brad for for those courses and all the resources you provide here on RUclips. It's deeply appreciated. Respect.

  • @IRgEEK
    @IRgEEK Год назад +15

    Brad's content always great. Thanks Brad. I've never had a good eye or been great on the CSS side. This gives me a good refresher/practice for my Monday. Thanks

  • @bonchan4404
    @bonchan4404 Год назад +3

    I love you brad . Im forever grateful to you . Because of you i got hired as a React Developer a year ago and now im in a senior position . Sorry if im not watching some of your videos anymore because i had enough and been stucked for tutorial hell for so long ! Thank you brad . Love from 🇵🇭

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

      awesome. How long did you study for and what study path did you take ?

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

    Brad is "the beast" of online teachers. Appreciate the content so much and I hope that many more are learning and developing by his instruction.

  • @rajiohida7143
    @rajiohida7143 9 месяцев назад

    When it comes to web design and development, Brad Traversy is the first to look up to. bravo Brad!

  • @christianaltamura
    @christianaltamura 28 дней назад

    This was EXACTLY the type of video I needed. I cannot thank you enough for your help.

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

    This has to be THE BEST Tutorial i have seen yet. Just the perfect Tempo to follow along and the Way you explain Things calmly is great. I understood how to use utility Classes and Variables so well. This just makes the whole Workflow so much easyer and better, then the Way i was doing it. It realy helps a lot for People like me who have done some Html Css Projects but just dont know the best Practices that u gonna need on a Job and how to go from a Figma File to a coded Website. This was great thanks so much!

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

    Every year Brad launches new tutorial of HTML & CSS. It is getting advanced each year.

  • @golden7877
    @golden7877 4 месяца назад

    backend dev here , i appreciate this video a lot as its been a lot since i touched css and this is a great refresher for me .

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

    Thanks a lot, this was very helpful, it wasn't aimed at total beginners, so I finished a beginner's tutorial called "HTML & CSS for Beginners" and then returned to this one, now I understand it all, thanks a gain for your time making this for us.

    • @olorunmolafunmilayo1816
      @olorunmolafunmilayo1816 2 месяца назад

      Hello Mhnoni,
      Please how did you get the figma link,its not opening from my end.
      Thanks

  • @Anarxhist0
    @Anarxhist0 Год назад +5

    I've learnt so much from you through your amazing videos.
    They are well detailed and explained.
    Thanks a bunch

  • @FallenAngelMMA
    @FallenAngelMMA Год назад +1

    This is simple brilliant!
    keep up the great work. We are expecting more content like this, beginner friendly tutorials!
    Thanks a ton!

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

    I was desperately waiting for this video from you.
    Thanks a lot 🙏🏻

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

    Perfect timing , i was looking for something like this! Thanks!

  • @lalalagg5043
    @lalalagg5043 21 день назад

    Today, this is the last video in this course of Html & Css thank you Brad for everything

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

    Thanks . I learnt many css tricks here. Great teacher. Trust this guy !!

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

    Hi there,
    I just wanted to let you know that I genuinely enjoy your content. It's always a source of joy and knowledge for me. Keep up the fantastic work! 👍

  • @ashutosh_tiwari
    @ashutosh_tiwari Год назад +1

    Brad is the Dev God🔥

  • @JurabekAbduhalilov-z7l
    @JurabekAbduhalilov-z7l Год назад +6

    Thank you for making such great videos

  • @ElementoryMyDearWatson
    @ElementoryMyDearWatson 6 месяцев назад

    This was incredibly helpful and informative. Thank you so much for your generosity in taking the time to create this and share it with us

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

    As always another terrific video from you Brad! Thank You Sir!

  • @khurramshehzad-g2b
    @khurramshehzad-g2b 5 месяцев назад

    Great efforts sir, i have some basic knowledge of HTML and CSS and this tutorial tested my knowledge and enhanced my skills broadly. keep doing this

  • @MonsurAlam-h1g
    @MonsurAlam-h1g 2 месяца назад

    Good initiative for me as a beginner. A lot of thanks from Bangladesh 💌

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

    It never ceases to amaze that he knows almost everything,frontend,backend,UI you name😅❤

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

    Not a noob but whenever I see any content from Brad, I just jump right in! ❤

  • @alimansimov1929
    @alimansimov1929 8 месяцев назад

    Just perfect, there are needed projects like this about the grid, flex, mobile-first design. Also it would be good about animation projects.

  • @JavierBautistaOrtigosa
    @JavierBautistaOrtigosa 8 месяцев назад

    Hey Brad, thank you for this tutorial. The best I have followed so far!

  • @AlexanderBelov-y8o
    @AlexanderBelov-y8o Год назад +1

    I know CSS and HTML very well. Still going to watch this video.

  • @daggerv3
    @daggerv3 Год назад +1

    When Brad says this is not a JS tutorial but you pick up some handy tips anyway.

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

    Hi Brad, another great demo - thanks so much !

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

    I love your work and i am able to come this far in my programming career because of your great videos......Thanks traversy media

  • @melvinnuslahdtuah269
    @melvinnuslahdtuah269 Год назад +3

    Long live Brad ❤

  • @SanjayMistry.
    @SanjayMistry. Месяц назад

    Amazing, thank you Brad 👍👍👍

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

    Such a great video! Always providing so much value!

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

    TRAVERSY MEDIAAAA LET'S GO

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

    Brad is a great teacher.

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

    Thank You Brad. You are the greatest at explaining the reasoning behind what you do so I can understand the big picture. **BTW I think FAB is for the "brands" library of Font Awesome. Please keep making these videos. I purchased your latest JS and Bootstrap courses and loving it so far.

  • @raphaeljaggerd3585
    @raphaeljaggerd3585 Год назад +3

    I love your stuff. Just finished your php mvc course (Don't ask why i'm learning php). I was wondering if you could do more low-level tutorials, under the hood stuff. For example building tools and libraries instead of just using them. I think that would help people become better developers.

    • @TraversyMedia
      @TraversyMedia  Год назад +11

      Nothing wrong with PHP, in fact I am working on a PHP From Scratch course and a Laravel course now 😉

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

      Can't wait@@TraversyMedia

    • @nimira43
      @nimira43 Год назад +1

      Can't wait for the Laravel course😊

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

      @@TraversyMedia, waiting for this, when will the course be released? any prediction? and what project is there using PHP? and also using Laravel?

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

    Thank you Brad I really appreciate the content you produce, as I am new to Web dev

  • @WebnetTechnologies
    @WebnetTechnologies 5 месяцев назад

    with this i say brad you are a God sent👍

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

    you are amazing! Congratulations for this video. It is very very educational and super well explained!

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

    Thank you for the vid. It was quite interesting. I did not have to google anything (except for out of curiosity), everything was easy and joyful.

  • @DmitrySafarov
    @DmitrySafarov 9 месяцев назад

    Thank you, Brad!. It is very useful!

  • @KarungiAisha-i5q
    @KarungiAisha-i5q 8 месяцев назад

    This is what I have been looking for

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

    I love your content, effortless and easy to follow. ❤

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

    hi Brad, I am a big fan of you. I watched your JS, Nodejs, Algorithm course. now I am looking forward your new reactjs18...

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

    Thanks Brad. I found it helpful

  • @MilanSisara-id8vv
    @MilanSisara-id8vv Год назад

    Lots of love from India

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

    Thanks Brad. Very helpful indeed.

  • @kasali310
    @kasali310 Год назад +1

    Hey Brad!Thankyou for your great and helpfull videos! i have learned a lot from you.I would suggest you to have to repos (start and end). So that we fellow a long.

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

    Great content. You could use absolute positioning for each of the individual images. But there’s also no need for that stress

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

    You are awesome mister traversy ❤🤗

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

    Can you make a forum next? Love your videos. Thank you, Brad!

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

    thank you alooot for your help sir i learn alot from you in this one video can you make more things about css please your the besttt love you

  • @fabioto-y7w
    @fabioto-y7w Год назад

    Thanks Brad, gratitude.

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

    Amazing. Thank you!

  • @Mike-df4ze
    @Mike-df4ze Год назад

    Good job, congrats.

  • @keldawott
    @keldawott 9 месяцев назад

    This was a great tutorial :3

  • @AbdulhaqqTV
    @AbdulhaqqTV 3 месяца назад +1

    thanks for the tutorial but i want to ask a question why is it that anytime i want to use google fonts i am not always able to pick or add it like you did.

  • @muneeb7980
    @muneeb7980 Год назад +1

    For the iCodeThis challenges, is there any way to view other peoples code for the challenges for situations when I get stuck? Viewing submissions does not let me view the code.

  • @Haroun.Benmahdjoub
    @Haroun.Benmahdjoub Год назад

    If you could walk us through a successful deployment of a mern stack, the app sometimes works all perfectly with all its features then it doesn't if not at all after deployment. Thanks Traversy!

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

    Thank you Brad for ur way of explanation. Request to make java tutorials

  • @danieligbinidu6880
    @danieligbinidu6880 Год назад +1

    Wow 😲😲

  • @tramparse84
    @tramparse84 Год назад +1

    Thanks for the tutorial Brad. I just have a quick question regarding the decision to build it desktop first. Would you generally advise to build mobile-first, then refactor for tablet/desktop?

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

    Thanks, Brad! Is this a newer version of the "Build a Responsive Website | HTML, CSS Grid, Flexbox & More" video tutorial from 3 years ago?

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

    I enjoyed your videos! Do you have any plans to create a tutorial on building an inventory management system using Next.js? Your tutorials are fantastic, and I'd love to see one on this topic! I also want to include some as well as utilize free APIs for data integration.

    • @TraversyMedia
      @TraversyMedia  Год назад +5

      Not an inventory management system exactly, but after I finish up my PHP courses, I am revamping my Next.js course. RUclips projects will follow.

    • @Yahya_Umar
      @Yahya_Umar Год назад +1

      @@TraversyMedia That sounds like a fantastic approach! Mastering both PHP and Next.js is a powerful combination. Your future RUclips projects are sure to benefit from this diverse skill set. Best of luck with your learning journey and the exciting content you'll create!

  • @nicanorarce157
    @nicanorarce157 10 месяцев назад

    i love you brad.

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

    This was a nice 2 hr clip. Big thanks.
    Is it possible to play out the integration of a fruit vendor into web3 from(already has 2 ORACLE's & play to earn concept) Cardano Network, imagine all sensors/hardware is present. 2 parts? Then Explore dynamics?
    1- Start with setting up Network
    2- Create Smart Contract between atleast 2 participants?
    * Zoom app (nutritional/fasting guide) + fruit vendor app.

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

    well explained brad
    keep helping us
    kindly make more videos on react advanced
    and next js framework

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

    I like this very much.👍👍

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

    Brad 🐐🐐, please make a 2023 react & Tailwind project! ❤

  • @Veecenzo
    @Veecenzo 6 месяцев назад +1

    How can i access the link for the figma file? Whenever i click on it, it automatically downloads but i can't access it.

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

    THANK YOU WATCHING FROM MALAWI

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

    Amazing!

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

    Absolutely FANTASTIC Brad thank you ❤. I and the rest of the community appreciate you 🫵.

  • @AlienationIsReal
    @AlienationIsReal 12 дней назад

    What software are you using? I used to use Microsoft frontpage but it no longer exists and something smiliar is impossible to find

  • @dougallen2742
    @dougallen2742 2 месяца назад

    What would you recommend for adding the Nav and Footer dynamically to the other pages?

  • @samsiddique4751
    @samsiddique4751 Год назад +1

    Thanks for the video please upload more content related to frontend, by the way which font and theme you are using in vs code ?

  • @Saba-cn8gp
    @Saba-cn8gp Год назад

    I have taken your courses, and yes, you are an excellent teacher, you helped me as well. Your free content is also very good, but I noticed that you don't use BEM. Can you say why?

  • @ShahzadAhmed-kt5zg
    @ShahzadAhmed-kt5zg Год назад

    You are Awesome love you sir

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

    Many thanks 🍻

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

    Thank you so much!

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

    We did not add the lg and xl class in the HTML so how are we adding them in the CSS.

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

    What VSC theme is being used? looks cool.

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

    Thanks Brad

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

    how would we know that if we will give max-width of 1100px then the navbar items will come in the center? it could be any pixels with number of width sir?

  • @nysunra
    @nysunra 5 месяцев назад

    Fast demo. A lot to take in, not much explanations as to the why of doing something a particular way. Very overwhelming for beginners but thankful to try.

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

    Hi Brad , thanks for your awesome videos I have learnt a lot . but I have question, Why didn't you use the measurements like width, height , font sizes from figma file , why aren't exactly the same ? thanks

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

    Thanks sir, is it possible to download the final code?

  • @squishyclip8846
    @squishyclip8846 5 месяцев назад

    how can i move the text heading in the hero container to bottom?

  • @joaquindelrio2806
    @joaquindelrio2806 8 месяцев назад

    Thank you!

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

    He may not be pregnant, but he always delivers.

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

    I was disapointed to find that the link to the Figma assets times out.

  • @VictoriaAyala-r9r
    @VictoriaAyala-r9r Год назад

    Im having trouble with the my websites logo image... its coming up as broken and im not sure why... can anyone help?

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

    thanks a lot for this video

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

    Phenomenal

  • @Chafi2008
    @Chafi2008 6 месяцев назад

    whats the app hes using to enter the code