Hello guys, first of all, it's an amazing project and thank you for teach us a lot of stuff. I'm here for the issue with the responsive part of the trending section at 2:15:17 . This issue is in the style CSS file, line 293 (or the beginning of the media queries for the trending section ) the problem is the misspelled of the class ".trending-drinks", he wrote "drink" instead of "drinks" :) and that's it. I hope it helps you with the issue.
I´ve just finished this project today 🥳 It´s the best feeling ever. This is the second one that I´m finishing (the first was the Modern Bank App w React). Thank you so much, your videos are so helpful!! I hope to be a dev one day 🙏
By chance if anyone is wondering why there Sushiman logo is not visible even after completing navbar-header section, change the z-index to -1 from 1 in header__logo-overlay
it's great to see a video where you go deep into css, i love it. keep them videos coming JSM, if you can do the next one with tailwind it would be great
Can i know how to resolve this error I am getting this error after the npm run dev [plugin:vite:css] [postcss] Cannot read properties of undefined (reading 'config')
love it . Please make more videos of this kind covering the basics so that beginners actually have a strong base and understand complex stuff clearly .
Hi! I rarely comment on a video, but I have been watching your videos in the channel for a few days now and I must say that you are really good at explaining and organising the work to be as clear as possible. Keep up the good work.
Phenomenal! Switching from a Non-tech background into Web development I was tremendously worried. Tutorial hell can be crazy but after finding this channel and this video in particular, i've become extremely confident to understand how things work between HTML and CSS. Crazy good tutor as well! Can't wait to learn more!!
Hii All, There is error in editting in Header and Nav Bar Part at 22:39 we suddenly jump to hero section and our header part is left out please stop at 22:39 and read code properly I waste one hour to figure this
Yeah, that part has messed a lot of people up. He should have pinned the solution in the comments. I had to read through so many comments to find out it's in the details of the video...but I have no idea what I'm supposed to do with it...I mean, it's a freakin' beginner course, no? So I stuck it to the bottom of the header.css file and it still doesn't work for me. Can you tell me what you did to get it to work?
Bruh, I can not wait to do this tutorial. I've paid $200 to Udemy for a year subscription, but that was before I found this channel. This is what I've been missing.
I didn't know I'd have to purchase a hosting site though. I'm still learning HTML and CSS. Is it necessary for me to get a paid hosting site right now? I mean, with the discounted price, 48 months definitely would be the plan I'd go for, but I done already spent $200 on Udemy and their trash ass courses.... I paid $100 to GitHub for their Copilot, which I've yet to use, and now I've come across this page where after visiting his site, I need to have been spending money with him! His knowledge and team's knowledge, and preparation is paramount in my learning journey. I haven't seen that at all on Udemy, or on UA-cam, other than Coder Coder with great preparation, and Kevin Powell with his extensive knowledge in CSS.
I think that is an error in header & navbar record,at the end of the header & navbar record (22.35), adrian is writing the h4 layout and than the video is directly skeeped to the hero section and we can see the header finished. there is no record for the ul display ecetera.
22:39 video jumped directly to the completed header without explanation, this might be a editing mistake but it confused me a lot as a first time lerner, please take care of it and i love your content 🙌🏻
BRO. I can not believe this. I started designing my own SUSHI website just a few days ago, for my portfolio, and I was trying to figure out how to implement the design, responsivenes and all the good stuff, and now you release this tutorial 😂 must be some kind of message from universe lmao
hello, great video but im encountering issue here when i run the npm first time. At 13:31 the header issue in the css file is resolved but new issue occurred from the js file.: [plugin:vite:import-analysis] Failed to resolve import "../assets/check.svg" from "JS\script.js". Does the file exist? Can u please guide how to remove this error so i could proceed thanks.
Thank you sir sir for this amazing project for beginners, some parts of code was not explained like the header__nav for overflow: hidden and the code for links in the header__menu was add just as a text at time: 22:39 --> 22:40. I hope there will be a new pfojects for beginners html css with good explanation for properties (why we do what we do) , it could be free or paid no problems but i hope to be shared here on UA-cam. Thank you so much a again.
When I put npm create vite@latest it says at Module._resolveFilename (node:internal/modules/cjs/loader:1145:15) at Module._load (node:internal/modules/cjs/loader:986:27) at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:174:12) at node:internal/main/run_main_module:28:49 { code: 'MODULE_NOT_FOUND', requireStack: [] } Node.js v20.13.0 how can I fix this
Good content, thanks! I came from a Python background and now learning JavaScript. It's really helpful when you start with the fundamentals. Maybe a design course or Figma will be a good topic too for your next content.
Volim te! Imam 35 godina i poceo sam uciti web development iako mi je i Engleski onako B2 level. Radim u lageru i nije mi cilj ni neke lude pare koliko promjena da mogu raditi od doma. Hvala ti za svaki tvoj video.
This video is incredibly helpful! The step-by-step guide and clear explanations made it so much easier for me to understand the process of building and deploying a CSS/HTML project. Could you make a video on building and deploying a JavaScript project as well in order to share how to manipulate DOM through JS? Thank you!
hey Adrian, I think the header and nav section is not the complete video! It seems you have that part of the video cut it and jumped to the next section. now my header and nav looks incomplete! guys have you also noticed it?
I'm having some trouble with the header section. When I add the css styles for .header__logo it doesn't separate the h4 from the ul. I've been trying to figure out what I've done wrong but can't. Any suggestions? Also, when I add the overlay styles it sits on top of everything. What am I missing?
Hi fam , i just have a small doubt in the beginning of the video itself .. the thing is .. import AOS from "aos" is showing error in my web .. what should i do? .. hel p me pls
Is it something wrong with my player or did the video skip a part about the header/nav section? at one point it was just the header overlay background color then everything in the nav bar was fixed. Can someone explain what happened to the rest of the video?
A quick tip, I think you should make more use of relative units for font sizes and width eg rems, ems, percentages etc. as opposed to fixed units like pixels. As the former helps more when it comes to responsive design.
The Japanese characters that we are providing: 日 (pronounced "ni" or "nichi") - This character means "sun" or "day." 本 (pronounced "hon") - This character means "origin" or "book" and is often used to refer to Japan, as in Nihon (日本), which means Japan. 食 (pronounced "shoku" or "taberu") - This character means "food" or "to eat." So, if you put them together, you might interpret it as "日本食" (pronounced "Nihonshoku"), which means "Japanese food" or "cuisine." We should always know whats in our website
I’m learning more from this channel more than I do in school and it’s free. But if if I have to request something could u use typescripts in those juicy react courses
C'mon, guys! Give it a like, we need more projects like this for a better understanding to React! #HTML #CSS #JS are the foundations of web development. A Figma course would be great as well!
Excelente tutorial, ojala algun dia gane lo suficiente para comprar tu curso, se ve por los videos en youtube que debe ser el mejor de todos. Saludos! y gracias por los tutoriales que das!
I would honestly appreciate more videos where you just use html, CSS and JavaScript, you explain everything really well.
Hello guys, first of all, it's an amazing project and thank you for teach us a lot of stuff.
I'm here for the issue with the responsive part of the trending section at 2:15:17 . This issue is in the style CSS file, line 293 (or the beginning of the media queries for the trending section ) the problem is the misspelled of the class ".trending-drinks", he wrote "drink" instead of "drinks" :) and that's it. I hope it helps you with the issue.
very detail. thankyou man
thanks alot
Thanks
Thanks a lot!
missing code at 22:41 and also the z-index in ".header__logo-overlay" should be -1
.header__logo h4 {
padding-left: 30px;
font-weight: 700;
font-size: 24px;
text-transform: uppercase;
font-family: var(--playfair-display);
color: #fff;
opacity: 0.8;
}
.header__menu, .header__menu-mobile {
padding: 20px;
flex: 1.236;
display: flex;
align-items: center;
justify-content: flex-end;
gap: 64px;
list-style: none;
}
.header__menu li {
font-weight: 500;
font-family: var(--plus-jakarta-sans);
color: var(--secondary-color);
font-size: 16px;
text-transform: uppercase;
line-height: 20px;
cursor: pointer;
}
.header__menu li img {
width: 24px;
height: 24px;
object-fit: contain;
}
.header__menu-mobile {
display: none;
gap: 20px;
position: relative;
}
thx dude
There is a missing part at the end of header css section. @22:39 to 22:40
yes this got me confused l just copied it from his GH repo, i hope theres nothing else mussing as im yet to finish
I´ve just finished this project today 🥳 It´s the best feeling ever.
This is the second one that I´m finishing (the first was the Modern Bank App w React). Thank you so much, your videos are so helpful!!
I hope to be a dev one day 🙏
How did you get the hero section to work? Because it's broken.
By chance if anyone is wondering why there Sushiman logo is not visible even after completing navbar-header section, change the z-index to -1 from 1 in header__logo-overlay
There is problem with video editing. Suddenly jumps into another section of code. Pause the video there and read the code and you will understand
anyone having the problem of your header logo disappearing once you style the header__logo-overlay?
Use z index
12:37 : Got Bio Tomorrow
22:42 - Determined to Push for the next Day 🥲
1:04:27 - Making Headway. Gonna design a site for a friend and finish this up 🥳
it's great to see a video where you go deep into css, i love it.
keep them videos coming JSM, if you can do the next one with tailwind it would be great
Amazing!
Can i know how to resolve this error
I am getting this error after the npm run dev
[plugin:vite:css] [postcss] Cannot read properties of undefined (reading 'config')
love it . Please make more videos of this kind covering the basics so that beginners actually have a strong base and understand complex stuff clearly .
Yup make more video like this..
Agreed, we need more of this
JS Mastery..A big blessing to tech community .
Thank you!
100%
Fr
Idk man, I wouldnt have been a developer without ur channel, big salute
Thank you! 😊
Hi! I rarely comment on a video, but I have been watching your videos in the channel for a few days now and I must say that you are really good at explaining and organising the work to be as clear as possible.
Keep up the good work.
There is a missing part in at the end of header css section. @22:39 to 22:40 there should be at least 4 min missing part.
Yeah same what is done there
Looks like the header & nav sections was cut short. All of a sudden the navbar appears finished at "22:35" without any explanation .
Phenomenal! Switching from a Non-tech background into Web development I was tremendously worried. Tutorial hell can be crazy but after finding this channel and this video in particular, i've become extremely confident to understand how things work between HTML and CSS. Crazy good tutor as well! Can't wait to learn more!!
The best html css tutorial on UA-cam
Hii All, There is error in editting in Header and Nav Bar Part at 22:39 we suddenly jump to hero section and our header part is left out please stop at 22:39 and read code properly I waste one hour to figure this
Yeah, that part has messed a lot of people up. He should have pinned the solution in the comments. I had to read through so many comments to find out it's in the details of the video...but I have no idea what I'm supposed to do with it...I mean, it's a freakin' beginner course, no? So I stuck it to the bottom of the header.css file and it still doesn't work for me. Can you tell me what you did to get it to work?
It has been a phenomenal build Adrian , thanks really needed this.Keep growing.
I have no complain about your content. I just want to say thanku teacher for teaching us that know one ever teaches ❤️❤️
Thank you!
Thanks Adrian, you have made my web development career more easier...
That's amazing! :)
Bruh, I can not wait to do this tutorial. I've paid $200 to Udemy for a year subscription, but that was before I found this channel. This is what I've been missing.
I didn't know I'd have to purchase a hosting site though. I'm still learning HTML and CSS. Is it necessary for me to get a paid hosting site right now? I mean, with the discounted price, 48 months definitely would be the plan I'd go for, but I done already spent $200 on Udemy and their trash ass courses.... I paid $100 to GitHub for their Copilot, which I've yet to use, and now I've come across this page where after visiting his site, I need to have been spending money with him! His knowledge and team's knowledge, and preparation is paramount in my learning journey. I haven't seen that at all on Udemy, or on UA-cam, other than Coder Coder with great preparation, and Kevin Powell with his extensive knowledge in CSS.
I can't stress enough how much I love this channel. We don't deserve Adrian, but we need him.
Thank you for your contribution to the coding community. You are good at explaining and organizing your codes. ❤❤
I think that is an error in header & navbar record,at the end of the header & navbar record (22.35), adrian is writing the h4 layout and than the video is directly skeeped to the hero section and we can see the header finished. there is no record for the ul display ecetera.
Just when I’m busy with HTML and CSS then you drop this ❤thanks let me do this tutorial
Enjoy!
22:39 video jumped directly to the completed header without explanation, this might be a editing mistake but it confused me a lot as a first time lerner, please take care of it and i love your content 🙌🏻
I notice it too
Yes same problem
22:58 bro you did skip the header section this is totally unfair.
Thank you Young Man !!! you are the best in UA-cam !! Blessings !!
Seriously 😳....great sir, you are showing a great consistency in making up projects and uploading videos time to time.
Thankyou 😊
Thank you!
Give this guy an Award, someone pleaseeeeee!!!!
Everything tutorial you put out makes sense! Yes! They make sense! Thank you.
Thank you!!!
I have problem with aos. animation isn't occuring
what happened at 22:40? seems like part of video was just cut😮
Why did you use overflow:hidden in .header__nav 19:36
loved it, thank you sooo much
When i use npm run dev, it shows pre transform error /main.js not found
This is the best channel on UA-cam 💕
Thank you so much!
Didn't Expect Html/Css Tutorial !!! Nice Job Anyways
Can bring some tutorials on MERN stack react native app please and yes on nextjs 13.4 also
Will do!
BRO. I can not believe this. I started designing my own SUSHI website just a few days ago, for my portfolio, and I was trying to figure out how to implement the design, responsivenes and all the good stuff, and now you release this tutorial 😂 must be some kind of message from universe lmao
That's amazing!! :)
Love to see such pure and amazing content more!
Thank you Sir❤
hello, great video but im encountering issue here when i run the npm first time. At 13:31 the header issue in the css file is resolved but new issue occurred from the js file.: [plugin:vite:import-analysis] Failed to resolve import "../assets/check.svg" from "JS\script.js". Does the file exist? Can u please guide how to remove this error so i could proceed thanks.
I'm having the same problem, did you figure out how to remove the error?
@@zeropixelsfilm nope dude. thats why I have commented here.
but If I m able to remove it I ll let you know.
@@ujwl6316 still no solution?
Thank you sir for bringing these type of *QUALITY* content for free❤❤❤❤❤
Ây pleasure! :)
Thank you for another Amazing tutorial Adrian, You're an awesome teacher.
Thank you! 😊
Thank you sir sir for this amazing project for beginners, some parts of code was not explained like the header__nav for overflow: hidden and the code for links in the header__menu was add just as a text at time: 22:39 --> 22:40.
I hope there will be a new pfojects for beginners html css with good explanation for properties (why we do what we do) , it could be free or paid no problems but i hope to be shared here on UA-cam.
Thank you so much a again.
Noticed it too got stuck there for an hour trying to figure out what was wrong with my code. xD
The best Javascript explanation ever, Thank you.
When I put npm create vite@latest it says
at Module._resolveFilename (node:internal/modules/cjs/loader:1145:15)
at Module._load (node:internal/modules/cjs/loader:986:27)
at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:174:12)
at node:internal/main/run_main_module:28:49 {
code: 'MODULE_NOT_FOUND',
requireStack: []
}
Node.js v20.13.0
how can I fix this
i have no idea what i am doing wrong but nothing is displaying when i run vite
Good content, thanks! I came from a Python background and now learning JavaScript. It's really helpful when you start with the fundamentals. Maybe a design course or Figma will be a good topic too for your next content.
same here :) i know Django framework as i used it to dévelop an automated task at work, im in logistics but learning to switch to Web dev
Volim te! Imam 35 godina i poceo sam uciti web development iako mi je i Engleski onako B2 level. Radim u lageru i nije mi cilj ni neke lude pare koliko promjena da mogu raditi od doma. Hvala ti za svaki tvoj video.
Thank you Adrian. Another great video!
Thank you, appreciate it!
I absolutely loved this tutorial and learned quite a bit. Thank you so much! ✨✨
This video is incredibly helpful! The step-by-step guide and clear explanations made it so much easier for me to understand the process of building and deploying a CSS/HTML project. Could you make a video on building and deploying a JavaScript project as well in order to share how to manipulate DOM through JS? Thank you!
Im halfway into react. Even im excited for this kind of tutorial.amazing man!
me too😊
Amazing!!! :)
Thank you so much JSM Pro for this video.Your tutorials are really helping me a lot!
Thinking of you being my mentor some days.
I have double checked the notification! It's a nice thing for freshers to get addicted to your Teaching ❤❤❤
Why do i get a "dependencies are imported but could not be resolved" error on the script.js file?
You are an amazing teacher. The concepts are well explained thumbs up sir
Appreciate it! :)
hey Adrian, I think the header and nav section is not the complete video! It seems you have that part of the video cut it and jumped to the next section. now my header and nav looks incomplete! guys have you also noticed it?
I'm having some trouble with the header section. When I add the css styles for .header__logo it doesn't separate the h4 from the ul. I've been trying to figure out what I've done wrong but can't. Any suggestions? Also, when I add the overlay styles it sits on top of everything. What am I missing?
missing code section for timestamp 22:39 is below
.header__menu li img {
width: 24px;
height: 24px;
object-fit: contain;
}
.header__menu-mobile {
display: none;
gap: 20px;
position: relative;
}
Finally something for beginners ❤
Love you Adrian
Thank you!
There is problem in video editing 22:37 and it suddenly jumps to another section and the header section remains unfinished
Anyone have the issue of animations not working at 1:30:49? Can't seem to figure out what the AOS isn't working. Thanks in advance!
Hvala Adrian, sjajno kao i uvek !
what happened after 22:39 it suddenly skipped and navbar was complete magically?
this project looks very clean 😀😀
Hi fam , i just have a small doubt in the beginning of the video itself .. the thing is .. import AOS from "aos" is showing error in my web .. what should i do? .. hel p me pls
Comment it until it's being used.
Is it something wrong with my player or did the video skip a part about the header/nav section? at one point it was just the header overlay background color then everything in the nav bar was fixed. Can someone explain what happened to the rest of the video?
Thank you for the course but more so, Thank you for the VSC Extensions list. Its amazing.
Amazing!
Great Stuff! Keep it up 😉🔥
Thank you!
Great Project, I just Loved it!
Wow Beautiful tutorial Adrian! TY❤🙏🏼
Sir.....The deployed site is not working...please check it....
Do more of this pure HTML CSS and JavaScript tutorials with modern designs and cool animations ❤
Will do! :)
A quick tip, I think you should make more use of relative units for font sizes and width eg rems, ems, percentages etc. as opposed to fixed units like pixels. As the former helps more when it comes to responsive design.
@@who_is_kaijuu lol not for font sizes
Just what i needed, its like you read my mind, love from india ❤
Love to India!
can someone please send me the starter CSS code, I checked github but I can't find it.
Th It we'll be cool for the next project to focus more on the responsive (media queries) aspects of the website. Thanks again !
Thanks for this tutorial 😢, but im having problems, my animations aren't loading, even after following all the steps.
1:29:36
did u find a solution
?
@@smithchauhan7169 either of you figure this out?
@@smithchauhan7169 either of you guys ever figure this out?
I Love Your Content brother. You deserve 10 million subscribers.
Appreciate it!
Appreciate your efforts 😊❤
thanks for the tutorial, but I noticed a cut in the header and navbar section. Is it a glitch or do you do it on intention?
I have also been stuck on that portion!
lmao me too @@lollypuddn
need more videos like this, where you teach advanced css and js animations
The Japanese characters that we are providing:
日 (pronounced "ni" or "nichi") - This character means "sun" or "day."
本 (pronounced "hon") - This character means "origin" or "book" and is often used to refer to Japan, as in Nihon (日本), which means Japan.
食 (pronounced "shoku" or "taberu") - This character means "food" or "to eat."
So, if you put them together, you might interpret it as "日本食" (pronounced "Nihonshoku"), which means "Japanese food" or "cuisine."
We should always know whats in our website
The sushi images in the assets folder are not loading up on my end. says... Error loading web view: Error: Could not register service worker
Hi Adrian, may i know what kind of app are you using at video 0:46?
responsiveviewer.org
I’m learning more from this channel more than I do in school and it’s free. But if if I have to request something could u use typescripts in those juicy react courses
It was really great tutorial. I learned a lot of things, thank you Adrian
Your teaching style is fabulous... thanks for making videos for the world... Thank you very much
Appreciate it!
Awesome work man...Thanks
why did you specify width 100% at 22:21 in header__logo-overlay
C'mon, guys! Give it a like, we need more projects like this for a better understanding to React! #HTML #CSS #JS are the foundations of web development. A Figma course would be great as well!
Excelente tutorial, ojala algun dia gane lo suficiente para comprar tu curso, se ve por los videos en youtube que debe ser el mejor de todos.
Saludos! y gracias por los tutoriales que das!
I was expecting JS Awards video because you told that it was the 100th video.
But OK Loved it too.
Coming next week! 😊
U r always best teacher for me ❤
Thank you! 😊
AOS not working even imported properly
this was fun! i wish you had more videos that used native js 😭
Another banger💥
By the way Adrian, i got some resquest to you. Could you make on the next video beginer full stack delivery app?
Great idea!
Again you came with a super duper tutorial
Appreciate it!
Thank you sir, for this tutorial🙏
Appreciate it!