Build a Starbucks Landing Page Clone

[@abmj5856]

Hi Brad, I just want to say thank you. Your courses are helping me provide for my family. Thank you! May god bless you and your family

[@TraversyMedia]

You are very welcome

[@futhi5075]

Have you found a job in coding due to these videos?

[@abmj5856]

@@futhi5075 A Job No. Lots of freelancing clients Yes.

[@abi_hajdari]

@@abmj5856 brother,hope you are having a great time.. im a complete beginner,i have learned html,and now learned css a bit too.... Can you give me any advice to learn faster,and to get freelancing clients?? How many months do i have to learn css and javascript before trying to get a freelance client??? thanks

[@abmj5856]

@@abi_hajdari Hi Brother, Thanks! Well I would say as soon as you can build a good looking website than that's the time that you should be freelancing don't wait to learn everything and than start your freelance journey instead learn on your journey. Also you don't need to know everything. A way to learn faster as by building projects for imaginary businesses in my opinion that helped me a lot. I hope this helped answer what you wanted to know 😁

[@josephwong2832]

great to see people still building with pure css / minimal JS

[@hectorserrano9314]

I doubt he'd simply use html and CSS for an actual project if this was a paid one or freelance. He's doing it for the purpose of just recreating the landing page with it but an actual project he'd likely use Next JS (SSR).

[@andrenations1]

@@hectorserrano9314 you right, but why 90 percent of the job out there says that you must to have a lot of knowledge in html css and javascript?

[@hectorserrano9314]

@@andrenations1 Because knowing the fundamentals is crucial. Yes, you may use a pre-processor or something like css-in-js but it all boils down to know the behind-the-scenes. The libraries will help with speed and make it less verbose but won't tell you where you're running into an specificity problem, a flex-container wrongly applied, something overflowing or something like that. You still need the fundamentals down.

[@scrappleful]

@@hectorserrano9314 Is it bad for a jr only know Css and Sass?

[@hectorserrano9314]

@@scrappleful I'd say you need to learn Javascript too and to be job-ready need to have dove at least a bit in a framework or library.

[@LoveEachDay94]

i learned more practical knowledge from you in 3 minutes than anyone else on the entire internet. when i get the xtra money im buying ur courses

[@borgestheborg]

I love these mock-up tutorials. Really helps with keeping up my CSS and JS skills.

[@bartoszjanprzybyszewski1891]

Man, so many people just wouldn't put these tutorials out like that for others to learn from. You are the real GOAT, thanks. I am learning so fast from your vids, great job!

[@CubanFireball81]

I really enjoyed coding along with this tutorial, I learned so much and many things were solidified for me. On top of this clone site, I added falling snow to my webpage just for an added touch of holiday cheer.

[@Abdullah-Md]

How to add that?

[@maripychavez5035]

This came in the exact moment to practice my skills with CSS!🤩

[@jordanryanethanowona2974]

cute

[@sathiranipun]

Highly recommended for anyone interested in improving their CSS and JS skills. Thank you, @Traversy Media, for your clear and concise content.

[@techboytutorials4733]

Once again, great content Brad. This is why you've been the one to inspire me to get into programming and tech, and now I'm trying to set up my own KZbin channel to give tutorials so I can help people too. Just so friendly, helpful and inspiring. Thank you for everything Brad.

[@proteus1]

I spent time learning html and css 12years ago. I kinda forgot a lot and I learned a lot about css and html from you. Thanks for the educational videos and have a good Xmas.

[@Fixable383]

I am happy to see a drop I am gradually improving thank very much

[@arman8k]

Thank you, Sir. Your Tutorials help me to be super_Skilled. Finished this tutorial in 7 hours by writing all the scripts that u have written. Understood clearly and my confidence level got higher. Best wishes to you, Sir.

[@blackpanda5093]

Finally learned how to create that hamburger menu... thanks alot Brad.

[@sonoftroy8572]

Love the content Brad! Im at the point, when I’m building apps, if I’m not using htaccess, routes, views, models, controllers, frameworks etc... then I don’t feel like my code base is modernized. And now I have to make sure the person I’m learning from is using the same standards so I can continue learning how to build production level apps. I’d never thought I’d be saying this to someone that I have learned so much from... thanks for being such a great teacher Brad. My knowledge of programming is growing and I’m rising to that next level

[@Cesaralvarezrealtor]

I honetly and trully cant wait to keep learning from your videos so I can land a job a support your channel through patreon.

[@chrisxlemus]

Hey Brad, just found your channel and it's amazing! I understand what HTML, CSS, and JS does so this is super helpful! It gives me a new perspective whenever I access websites now.

[@aravindg9644]

Kudos Brad!! Great thinking for the grid reversed concept. You play a huge role in sharpening my CSS & HTML skills a lot.

[@LahiruNikolin]

Hi brad, your contents are top quality. you rock!

[@ZestiosX]

Thank you Brad for this video. It helped me create and understand my first mobile menu.

[@ezekielswanson7813]

Thank you so much for this! This will help me land my first every internship as a self taught dev. You're the man.

[@Speedy4you10]

Brad. Great job doing website videos! Just subscribed and kind of new to the channel. I poped in from time to time looking at videos.

[@Bella_Will]

Thank you Brad, you made me to love css and you always know how to easy my stress and expectations.

[@jitendrakumarsingh1137]

Thanks again for the tutorial. I am following your CSS custom framework approach since the Heroku website clone project

[@alkhemist6631]

Thank you Brad. You've been instrumental in my journey to become a developer. ❤❤❤

[@UsmanTheDev]

Hi Brad, it's really helpful. I think you are shifting towards web3 technologies. an in-depth course on DAPPs will be appreciated. Thank You!

[@marcinzale]

As usual very good tutorial. Well explained. Thanks!

[@Arabian_Abomination]

Nice!!!! I want some coffee now ☺️

[@yousafwazir286]

Nice really helped me understand

[@danielbabu6010]

Brad is Late ! Happy To Get Tutorial ! Thanks !

[@Mrjiggyspuggy]

Sure has been awhile. Missed ya 🤗🤗🤗

[@scoppyeah]

Phenomenal as always

[@caipyear644]

Not all hero's wear capes!

[@iwokssama4772]

Well, it's very good realisation.

[@tinatwine137]

Great video!! Happy New Year!

[@chaybislam]

Thank you sooo much you are changing lives :)

[@mohammadthousif5373]

Excellent tutorial!! Keep more of these coming, very helpful for beginners.

[@Liendea]

That was fun! 😃 thank you!

[@ssatriyaa]

Thanks brad, always like this kind of tutorial

[@gpynadath]

Thank you so much. It was very helpful. I learnt a lot.

[@marcielledepaula3373]

Love It 😍😍

[@katm1884]

Good to know how the big dogs do it. Thanks. Love to see a css grid for youtube thumbnails with lazytube

[@MeezanTheFairBloke]

Awesome video, love how you keep stuff simple. Watch some other code along vids, guys are pulling out the weirdest selectors... before you know it, your lost AF. Thanks Brad, keep it up!

[@jimjuris]

Thank you for creating this great video.

[@mahmudulhasanovi5621]

Hello Sir,which theme are you use.it looks very nice.

[@Fred-my9er]

I learnt so much, thank you

[@HtopSkills]

Well explained

[@thepatsyfamily]

As someone who's just starting to learn, the speed in which you code and know what goes next is intimidating.

[@77mikaella]

i love this projects thanks a lot

[@technologynwal-baru2227]

Hey Brad your tutorial always wonderfully and very clear thank for sharing your marvelous knowledge, but here I have one question when we click on hamburger instead of using html to display the mobile menu can we use JavaScript to display the menu if it is possible can you please make tutor for that

[@julianvelez6563]

Nice work

[@andreea34]

Two thumbs up for the custom framework approach to CSS (reusable utility classes). But for the media queries, shouldn't the layout be coded & styled with a mobile first approach? In other words, styled initially as single column and progressively enhanced to more columns as the screen size increases? I noticed that many sites have paid less attention to this since CSS grid & flex became popular, and manipulating layout is getting easier and easier. Is mobile first coding still a relevant approach these days?

[@riskitall7421]

"Is mobile first coding still a relevant approach these days?" -> Depends if you think web development is still relevant these days xD

[@fbnx4219]

Great tutorial! I think you cut out a bit too much at 10:38 though, as you do not mention the img style.

[@mkhululimtshali7576]

Very helpful turtorial, Ima go ahead and add the functionality that, when you click on the links on the mobile menu, they hide the entire menu as if you clicked X on the hamburger button.

[@mohammedabdulaziz3658]

Great sir, helpful for me in CSS & Js

[@stevenARTify]

With that code field, are you able to convert all of that into a theme to install to a wordpress?

[@himanshukatiyar4282]

you are my inspiration

[@mikejakusz1493]

Awesome video!

[@denhamk]

Please could you mention the image sizes of the grid cells? My images don't fully fit the cell. They appear smaller and to the top left. How did starbucks get the images to fit into 1fr?

[@Star-hw8bh]

Thanks for the tutorials

[@mojtabaghezel]

there is a problem, when the navbar was opened in mobile size, it was not automatically closed in larger sizes.

[@andrenations1]

bro i had that problem as well, im trying to fix it for days🤣🤣🤣 let me know if you could’ve fix it ok 👍🏿

[@smithivory8154]

My man! Thanks dude!

[@wetsand7379]

this was awesome! thank you so much!

[@margosdesarian]

Fantastic!

[@vlr9999]

Hi, Brad! What about take some ugly page and makes it look better, not just cloning?

[@brunacontino9525]

Can someone explain me why setting the flex to 1 moves the item to the left, please? Thanks in advance!

[@MuhammadShakir-p1c]

Questions, If Screen changes the mobile menu stills shows. I have to click refresh button to hide the menu

[@adrianmontilla3095]

but please mainly make the shopify navigation menu please with all its elements, I think it would be an excellent practice 😂

[@adrianmontilla3095]

and I would also love you to make a tooltip that contains buttons, images, texts, etc., with html, css and js

[@rainerhamann3938]

Thank you!

[@georgegeorgio70]

Great Video ! What is the font you are using in vsc?

[@berkaygurcan141]

First of all, thank you for the video. I took and finished your html/css course. It helped me a lot. I want to ask you a question. .navbar-nav-left { text-transform: uppercase; flex: 1; margin-left: 20px; } I didn't understand the flex:1 feature here, I watched your videos, I did some research on the internet, but I couldn't understand how it sticks to the left, can you briefly summarize?

[@ezevalentine7610]

Thanks Brad

[@RomanBehroz]

great work buddy, thanks alot

[@sumeyyeusluerdeniz148]

Thank you so much for this video. İt's really helpfull and successfully. I hope you will do like this video. 👍☺️

[@forbidden_lion]

Love you boss!

[@sraynitjsr]

Thanks a lot, loved it

[@aureliojmnz2959]

Awesome as always...love all your content. quick q, wondering why you didnt begin "Mobile First Design" on this one? (God knows this is where I get stumpped on since my habit is desktop first)

[@rishadali2866]

Well there's an extension in Chrome called what font which could tell you which font is it

[@rifatspk]

Hello Brad, Do you have a plan to make a video about framework7 ????

[@FBmuzic]

Vs code theme name please?

[@bertrand00956]

Nice ! For the boxes using grid, since the images alternate being shown on right and left, why not use argument section:nth-child(odd/even) grid-col-2 instead of making a class grid-reverse ? wouldn't that be more practical ? I did the following => section:nth-child(even) .box-text{ grid-area:1} (instead of order).

[@scaredcrew]

May I know what theme you are using in vs code?

[@dragonore2009]

Does anyone know how Brad obtains all the svgs and images to do these clones? I realize there are chrome extensions that extract images, but what about svg files?

[@theaestheticgenius]

Hey Brad! Could you please do a three.js crash course?

[@nitinnangnurkar2840]

In Microsoft clone i don't found images on codepen pls help

[@zachfenton608]

very well done

[@kenroyarcher2496]

Hi. What CSS coder formatted are you using? Or can anyone suggest a good one? Thank you.

[@elizduarte6547]

What is the name of this theme used is vscode?

[@kuylievismatulla5118]

Thanks so much that's great looking keep it up great work Brad 👍

[@adrianmontilla3095]

excellent video travesy media, could you please make the complete shopify navigation menu with its accordions and everything else just the complete menu please, I hope you take it into account and make it, who supports this idea?

[@hassaneoutouaya]

Thank you Sir!

[@TedyProduction]

I love it thank you

[@georgehammond867]

Can class name have 2 or more names inside the same class element? that would make it easy to style in css. Great work from Traversy, really informative, Tanks man. i always learn more from these long and advances Clone Pages build in finding bugs to repair in own projects.

[@jamesngari8748]

Great tutorial👍

[@tuan9024]

what is your vscode theme ?

[@lecterpsy]

Thanks for so a cool video.

[@tshepomolete5092]

Could you please do a music website page, where you can listen to and download music?

[@yousafwazir286]

Nice

[@mahadimasnad1231]

Can you please name the VS Code theme?

[@cubedev4838]

Hi brad, thank...please make tutorial hoe to set up google Analytics in our website