Build and Deploy a Fully Responsive Restaurant Website with Modern UI and UX in ReactJS

Поділитися
Вставка
  • Опубліковано 7 вер 2024

КОМЕНТАРІ • 661

  • @afridirahman5464
    @afridirahman5464 2 роки тому +125

    Your Project builds has always been top class. In recent videos I'm noticing your presentation quality has gone to another level. Can't thank you enough for providing such quality contents

    • @javascriptmastery
      @javascriptmastery  2 роки тому +2

      In which part specifically did you notice the improvements? Thank you! 😊

    • @anishbabbar8057
      @anishbabbar8057 2 роки тому +4

      @@javascriptmastery intro level📈📈

  • @VVitherr
    @VVitherr 2 роки тому +16

    Since i've started programming i watched dozens of tutorials, and by far your channel provides the best quality among all of them. Great work, incerdible content!

  • @soujigor
    @soujigor 2 роки тому +18

    August 15th 2021, I decided to change carrier and dived into programming. Since then, I've watch several tutorials, courses and hints to learn and improve my skills. This channel is by far the best one.
    Great video, great content! Thank you for sharing this with us.

  • @nitinsoni9956
    @nitinsoni9956 2 роки тому +18

    You an amazing instructor and more amazing human-being. Providing more quality content than the paid ones for free here on youtube.

  • @mattoattacko
    @mattoattacko 2 роки тому +3

    As soon as I saw the description saying we were building something from a Figma file, I was stoked! Thank you for listening to our requests!

  • @smarthustlersclub6375
    @smarthustlersclub6375 2 роки тому

    am not even a programmer, but this man for the past 3minutes, make me like ReactJs, is super awesome to watch someone that know how to teach stuff

  • @vikk1249
    @vikk1249 2 роки тому +27

    Got job because of you , keep inspiring

  • @paulus_de_gross5996
    @paulus_de_gross5996 2 роки тому +6

    Actually you're pretty damn close to the actual pronounciation of Gericht! And thanks, you're one of the best javascript-teaching channels on youtube!

  • @shadmansakib8787
    @shadmansakib8787 2 роки тому +16

    We need an awesome full-stack portfolio tutorial from you sir

  • @anuhyabalija7857
    @anuhyabalija7857 2 роки тому +7

    You add so much value to the community. Thank you for helping us out. I recently made your web3.0 build it's just amazing I learnt so many things from that video

    • @javascriptmastery
      @javascriptmastery  2 роки тому

      Thank you so much Anuhya!

    • @nguepsifinance
      @nguepsifinance 2 роки тому +1

      @@javascriptmastery Liked, subscribed, and joined the community.
      Keep up the good work.

  • @mcuddles1809
    @mcuddles1809 2 роки тому +5

    What a legend! This is on another level.
    Thank you so much for sharing your knowledge with us.

  • @shivampatel9781
    @shivampatel9781 2 роки тому +26

    Hats off to you man for the best quality content on UA-cam. This is one of the best channels I came across for JS development. If possible please try to cover Angular also. And Thanks a ton.

  • @rahul-thakare
    @rahul-thakare 2 роки тому +2

    Was waiting for a new video and seems like it was worth.
    Awesome tutorial as always!
    Many thanks to this channel.

  • @SamrudhSwaminathan
    @SamrudhSwaminathan 2 роки тому +1

    Omg , This is getting better and better with every video! Thanks a bunch for these tutorials!!

  • @keshavakumar9828
    @keshavakumar9828 2 роки тому +4

    I learned a lot from you, the amount of amazing content and knowledge you provide is a blessing. from 1 of Feb ill start applying for jobs and once I get it ill be supporting you. thanks again for bringing such quality content for free.

  • @bmx9421
    @bmx9421 2 роки тому +5

    I'm very glad I've found your channel. It is a big treasure on yt. Have you ever thought about making an admin panel, like fuse angular? I mean with working login/register functions, settable online/offline/away status and file upload to store. I'd be very grateful, if you'd mind doing a video of it! :D

  • @dr.drunkenstein7026
    @dr.drunkenstein7026 2 роки тому +2

    Dude your project videos are so much better than paid courses project videos and you do it for free just for us 😀 no words to thank you 🙌😄

    • @javascriptmastery
      @javascriptmastery  2 роки тому

      Imagine how a paid course from me would look like... 👌

    • @dr.drunkenstein7026
      @dr.drunkenstein7026 2 роки тому +1

      @@javascriptmastery dude you should definitely create complete web development paid course with awesome projects and understanding of each and every thing 😀 I am 100% sure that your course will become highest rated web development course 🙌😄 or bro you can create complete web 3.0 course because there are very less web 3.0 courses available and they are not much good and you will rock it in that 🥳

  • @user-uu7ub5gb6l
    @user-uu7ub5gb6l 2 роки тому +1

    This is a great start for those who began to learn Js and React!!! I could not thank you enough for your content! I think this project and the knowledge I got from your tutorials are gonna help me get a job soon!!!!)))

  • @IqonicDesign
    @IqonicDesign 2 роки тому +1

    Thanks For Recreating Our Official Design And Instruct Briefly To Designer Community Keep Supporting Us

  • @ikennamanagwu9646
    @ikennamanagwu9646 2 роки тому +1

    I love this channel so much ... You are just too good bro, I literally have a whole playlist titled JS Mastery no cap.

  • @Geomaverick124
    @Geomaverick124 2 роки тому +6

    I think it's cool that these projects can be turned into a series now. You could include the Nextjs Landing page into this series as well. I could also see a Web3 series or a Social Media Series. This project could be added to an eCommerce series if they connect it to Shopify similar to your Shopify course. Keep up the great work. It would be cool if you include these UA-cam series on your platform so that just in case something happens to UA-cam, your students can still access your awesome projects

    • @javascriptmastery
      @javascriptmastery  2 роки тому

      Thank you so much for the ideas, that's the goal! 👌

  • @hosseinjafari2896
    @hosseinjafari2896 2 роки тому +2

    Wow!!!
    Thats unbelievable .😯
    You won't ever understand how helpful it is for me. 🤩🤩
    Thank you a lot 🌹🌹
    I wish you the best ❤️❤️❤️❤️

  • @melania239
    @melania239 2 роки тому +2

    Thanks for not using a lot of dependecies 💙 your videos are the best!

  • @vedantingole8711
    @vedantingole8711 2 роки тому +2

    this is what I was looking for. As always perfect timing.

  • @Enthe0genic
    @Enthe0genic 2 роки тому

    I think this project much more easier than your e-commerce video. Or I've become skilled I want to believe Thanks for your video. You're really best teacher🤗

  • @kenthefley2226
    @kenthefley2226 2 роки тому +3

    I cannot say enough good things about the content you provide. It's a goldmine of knowledge. Thank you for all the work you have put into this. I was wondering if you could do a tutorial on how sass would be implemented in a project like this. I am unclear on how that would be set up.

    • @mertre34
      @mertre34 Рік тому

      Ya I'm stopped in my tracks after adding 'nom install -D sass'. I get errors about the postcss-normalize plugin failed

  • @adimishra3046
    @adimishra3046 2 роки тому +2

    Hello javascript Mastery,
    I comment very rarely but bro your channel is next level ❤️❤️ love your content brother... I can't tell you how much you helped me 🙏🙏 thank you and love from India

  • @IrfanAhmad-bn6ky
    @IrfanAhmad-bn6ky 2 роки тому +1

    Nice tutorial. I learnt lot of things about react. Thank you.

  • @johannbausch569
    @johannbausch569 2 роки тому +1

    What a legend!
    You are the best, there is no one better than you on youtube.
    Good projects, good presentation.
    I was about to give up on my web dev journey and I watched your videos, now I am back, thank you for such quality work!
    Could you make this a MERN project tutorial?

  • @JorgeRivera-rp1zw
    @JorgeRivera-rp1zw 2 роки тому +1

    HI. DEAR FRIEND ...!
    THANKS TO SHARE WITH US YOUR AWESOME VIDEO ...YOU ARE REALLY A GREAT HUMAN BEING...!
    At the pandemic moment, there are a lot of people who can not afford any coin, but need to learn something in order to survive ...MANY THANKS AGAIN...!
    GOD BLESS YOU.

  • @habib_nuhu
    @habib_nuhu 2 роки тому +1

    Always like before watching, Because I know I won't be disappointed, keep up the good work, thanks for sharing.

  • @DhruvSharma-zu7pq
    @DhruvSharma-zu7pq 2 роки тому +1

    you're the best Javascript master on youtube that I know

  • @dalestewart
    @dalestewart 2 роки тому

    Top professional world class applications that we are building. Thanks

  • @andredixon7961
    @andredixon7961 2 роки тому +1

    Fantastic! I just finished coding bootcamp and was looking to complete a practice project integrating Figma into REACT for my portfoliio.

  • @afolayanafolasade2975
    @afolayanafolasade2975 Рік тому

    Waw...how come it took me a long while to find this great content on the internet....all this for free🥺.... you're very amazing sir

  • @cstroudio7516
    @cstroudio7516 2 роки тому +1

    Seriously the best videos! I learn something new with everything you drop! Would love to see something with a payment system or subscription based model.

    • @javascriptmastery
      @javascriptmastery  2 роки тому +1

      Great ideas Chad! I'll try to get something soon 🔜

  • @ferdinandeke9590
    @ferdinandeke9590 2 роки тому

    Don't take this the wrong way, but I love you man...been looking for this. Thanks a million

  • @Footballworld7725
    @Footballworld7725 2 роки тому +1

    This is the best channel about coding

  • @amosmachoradevlogs
    @amosmachoradevlogs 2 роки тому

    I've watched the whole 3hrs and I regret nothing.

  • @japanlocal6841
    @japanlocal6841 2 роки тому

    simply the best content on UA-cam!!..... no one can compare
    Hvala vam puno

  • @rodsimon7
    @rodsimon7 2 роки тому +1

    This is an unbelievable tutorial, the quality of teaching and patience are simply unreal.
    But if I could ask for just a little more from you, what makes you choose to use "rem" and or "em" in CSS? I never managed to really understand the difference between them.

    • @bartderuyck
      @bartderuyck 2 роки тому +1

      I'll chime in here to answer.
      em is an elastic unit that takes its relative sizing from the PARENT element. So if you're defining ems inside a div that's (for example) three or four divs deep, the em sizing will be relative to the PARENT div.
      The r in rem stands for ROOT and sizing anything with rems takes its cues from the HTML element all the way at the top. So it's not dependent on any parent element.
      The big difference is that rem is more consistent throughout the design, whereas em may differ significantly depending on any parent element.
      Does that make sense?

    • @rodsimon7
      @rodsimon7 2 роки тому

      @@bartderuyck That was actually really helpful, thanks!

  • @sammbende2
    @sammbende2 2 роки тому

    JSM! AlwaysOnTop. You are not just a teacher, but an awakener.

  • @adulojujames2985
    @adulojujames2985 2 роки тому

    How much i wish I can like this more than once

  • @levyroth
    @levyroth 2 роки тому +2

    This is premium content right here! Love this!

  • @carl2836
    @carl2836 2 роки тому +2

    Thank you so much for this. Very informative and the explanation is very clear.

  • @richiemawunyo5493
    @richiemawunyo5493 2 роки тому +2

    Your projects are fantastic, thank you champ 🙌💥

  • @Geminis3505
    @Geminis3505 2 роки тому +1

    Amazing project. Please more videos projects like this one!!

  • @madanmalhotra
    @madanmalhotra 2 роки тому +2

    You are the main reason I am learning react. Plz keep up with good react work. ☺️

  • @mattoattacko
    @mattoattacko 2 роки тому +9

    If anyone's Newletter styling is broken and doesn't appear to be rendering, it's because @2:50:01 JSM switches "z-index: 100" ---> "z-index: -1", but doesn't mention anything about it. Switching from "100" -> "-1" solved my issue.

    • @AmMazino
      @AmMazino 2 роки тому

      thank you

    • @priyankapriya9945
      @priyankapriya9945 2 роки тому +1

      THANK YOU SO MUCH I HAVE SPENT AROUND 1 HOUR TO RESOLVE THIS AND FINALLY I GOT YOUR COMMENT AND FIXED IT.

    • @mattoattacko
      @mattoattacko 2 роки тому

      @@priyankapriya9945 Great! Glad I could help :)

  • @BSimone95
    @BSimone95 2 роки тому +3

    The design looks great!
    As someone who is learning web dev something that would be really useful would be a video where we see you iterate on creating a design or reproducing it through css. If we can follow your train of thought and see the trial and error, it becomes a lot more relatable to the experience of building a website from scratch and trying to make it look good.
    That being said this is still very useful and I'm going to steal some styling ideas without a doubt :)

  • @nightmare22154
    @nightmare22154 2 роки тому

    Haven't watched the video yet, but from the introduction, I know this is gonna be a banger like all the latest videos♥♥

  • @themichaeljoel
    @themichaeljoel 2 роки тому +1

    I will not follow your tutorials if you don't start them with a "Hi there" lol
    It just sounds so satisfying the way you say it.
    My girlfriend said it reminded her of SpongeBob when he was "utterly normal"

    • @javascriptmastery
      @javascriptmastery  2 роки тому

      Hahah that made me laugh, I'll definitely start more with Hi there! 😊

  • @spellsaif
    @spellsaif 2 роки тому +1

    Your videos are getting awesome day by day. Thank you 😊

  • @zhanezar
    @zhanezar 2 роки тому +1

    You are my favourite person doing REact tutorials thank you so much --

  • @Decoder87007
    @Decoder87007 Рік тому +1

    if someone is facing an issue with scroll handler in the Gallery section, then replace your scroll handler method with the below one, and it will solve your problem of scroll left images
    const scroll = (direction) => {
    const { current } = scrollRef
    if (direction === 'left') {
    current.scrollBy({
    left: -300,
    behavior: 'smooth',
    })
    } else {
    current.scrollBy({
    left: 300,
    behavior: 'smooth',
    })
    }
    }

  • @alykane6347
    @alykane6347 2 роки тому +1

    Empathic Content! Just like this guy knows what's going on into my mind.

  • @pramodarachchige6972
    @pramodarachchige6972 2 роки тому +1

    Youre my best javascript master 🥰 I've learnt lot from you about react and nextjs. When I feel lonely in studying and following other materials I always come to this place for learn something new. Thank you soo much your hard work and good luck with your career 😁🤗❤️‍🔥

  • @0xtz_
    @0xtz_ 2 роки тому

    UA-cam need more videos like this 👍

  • @queenofsheba8275
    @queenofsheba8275 2 роки тому +1

    Subscribed, and now commenting to support this channel. Thank you for all the effort and hardwork you put into making this video.
    I'd really like to see a a good looking modern ecommerce website with and admin dashboard that allows product upload.

  • @andriyabu
    @andriyabu 2 роки тому +1

    Thank you man. I appreciate all your hard work to deliver this awesome video 🙏🙏

  • @gauravtiwari1658
    @gauravtiwari1658 2 роки тому +1

    this is absolutely lit 🔥🔥. We would really appreciate if you start using typescript as this is the industry standard.

  • @Dcooper676
    @Dcooper676 2 роки тому +1

    I was just looking for a figma tutorial
    Thanks lot!
    👌

  • @rahem8004
    @rahem8004 2 роки тому +1

    your tutorials are always the best on UA-cam,

  • @sourav_96
    @sourav_96 2 роки тому +2

    Please make a dasboard video having charts and maps, great content as always😍

  • @amosmachoradevlogs
    @amosmachoradevlogs 2 роки тому

    I am 32 mins in and i am not regretting anything at all.

  • @MOHIT-PRASAD
    @MOHIT-PRASAD 2 роки тому +2

    58:25 I'm not really good with typing today
    This video is different from rest of project videos of channel 🤣 so much fun
    I watched continuous till this time, hope to complete it fast with more typing mistakes 🤣😂

    • @javascriptmastery
      @javascriptmastery  2 роки тому +1

      Thank you so much! I'll try to keep it more entertaining in the future as well! 👌

  • @rachanajay1730
    @rachanajay1730 2 роки тому +1

    The underscore underscore lives inside my head rent free lol

  • @mithunyadav8495
    @mithunyadav8495 2 роки тому

    Joining this course today, Excited to learn and grow.

  • @SvetaSveta-ms4hi
    @SvetaSveta-ms4hi 2 роки тому +1

    The best channel on coding! 😍😍😍 THANK YOU SOOOOOOO MUCH!!!!!!!!

  • @nadinemathew5219
    @nadinemathew5219 2 роки тому +1

    Completed implementing this tutorial. It was very informative. Looking forward to more tutorials. Please let m know if I can use the same in my Personal Portfolio

  • @mohammadkhalaf8843
    @mohammadkhalaf8843 2 роки тому +1

    The best channel in youtube. Thank you for this great content

  • @onyeukwuhycient438
    @onyeukwuhycient438 2 роки тому

    Nice one Adrian, your videos are always the best in their categories..

  • @felipepastana
    @felipepastana 2 роки тому

    You provide a really great benefit to mankind with your job here! Keep up the good job!

  • @yungxix6343
    @yungxix6343 2 роки тому +2

    Always delivering top-notch content

  • @dsa0decoded
    @dsa0decoded 2 роки тому

    You set the bar really high for JS project tutorials the projects are so relevant and every project have something new to learn ❤️

    • @dsa0decoded
      @dsa0decoded 2 роки тому

      @@shivani9840 Yup I am learning web dev for about 1.5 yrs have learned much in front end from HTML to next/gatsby

  • @bkashkumar1981
    @bkashkumar1981 2 роки тому +4

    Wowww, this project is simply on another level. Never seen like this before. Thank you for sharing with us ;)

  • @MJ-yu6is
    @MJ-yu6is 2 роки тому

    Hey. I am forever grateful to the fact that you share your skills freely and help improve other developer's lives too. God Bless you men!

  • @shreyas.sihasane
    @shreyas.sihasane 2 роки тому +1

    You are really doing great 👍👏👏❤️
    Can you please provide live Preview of completed website.. please

  • @czarscrib3680
    @czarscrib3680 2 роки тому

    I swear this is the best channel for web development ♥ youre the best bro.

  • @HerDigitalMedia
    @HerDigitalMedia 2 роки тому +1

    @JavaScriptMastery This is amazing! Could you create a video showing your planing process for the newby freelancers? Such as how you come up with the website name, theme, logos, tools you would recommend over others with the process etc. I'm a self-taught developer and while looking for a position I like to take more jobs and build a clientele.

  • @mounir101
    @mounir101 2 роки тому +1

    Pretty helpful video actually! Thanks so much JM and God bless endlessly.

  • @thiernodiallo2612
    @thiernodiallo2612 2 роки тому +1

    Thank you for this awesome project. You are really the best in your industry. I have a recommendation: could you please do ecommerce marketplace web application where people can sell their own products?

  • @rmagdiel
    @rmagdiel 2 роки тому

    Blessings.
    I was able to adapt this same project in typescript and nextjs, I had to type a lot of things but it was very useful to practice typescript and next. Thank you very much

  • @Kevin-jc1fx
    @Kevin-jc1fx 2 роки тому +9

    Does anyone know where we can find other design files to practice with? I want to make sure I am able to implement one with no external help. It is an amazing video as usual. Your content quality is over the top. Thanks for making this available on UA-cam.

    • @javascriptmastery
      @javascriptmastery  2 роки тому +1

      Thank you so much! ❤️

    • @nevondiaz
      @nevondiaz 2 роки тому +1

      just pick any website you like and try to copy it on your own :b

  • @coder2771
    @coder2771 2 роки тому +1

    wow just amazing content. hats off the hard work you put into it

  • @everythingalwayscomestoane4829
    @everythingalwayscomestoane4829 2 роки тому +1

    Everyone like the video so we could get another one of these awesome videos

  • @prasdxA
    @prasdxA Рік тому

    Thank you so much for this amazing project. Your videos have been very helpful in my learning of React.

  • @rahullraj7667
    @rahullraj7667 2 роки тому

    Please make a detailed video about freelancing in web development space in 2022, on how to get clients etc

  • @incentive9543
    @incentive9543 Рік тому

    Amazing project man , please create more projects like this buddy🙌🙌

  • @Azikkii
    @Azikkii 2 роки тому

    If you want the footer logo color to match the design this filter should work. No need to mess around in photoshop(do this directly on the img itself): filter: invert(14%) sepia(29%) saturate(467%) hue-rotate(2deg) brightness(91%) contrast(90%);

  • @lmvysakh5666
    @lmvysakh5666 2 роки тому

    You are incredible man... Please never stop what your'e doing.. Love your content !! 😍😍😍

  • @syrymumbetov7796
    @syrymumbetov7796 2 роки тому +1

    Great video as always. Your hard work is appreciated. Thank you!

  • @andrejkling3886
    @andrejkling3886 2 роки тому +2

    One more... You are One of the Best

  • @diyorbaynazarov2164
    @diyorbaynazarov2164 2 роки тому +1

    Very excited to learn new things in this video

  • @my_j.a.r.v.i.s.
    @my_j.a.r.v.i.s. 2 роки тому

    You are amazing.
    Keep maintain this quality of contents.
    You are Gem for our community.

  • @ashikmahmud4076
    @ashikmahmud4076 2 роки тому +1

    Just amazing your presentation and accent as well 🙂 take love

  • @nikhilbankar4412
    @nikhilbankar4412 2 роки тому

    Don't wait for 15K likes, just go for the series. We need it.

  • @Ayydos
    @Ayydos 2 роки тому +1

    dude thanks so much for all you do!!

  • @chadbrowsky2496
    @chadbrowsky2496 2 роки тому +1

    Smooth like butter! Love it sm❤️

    • @javascriptmastery
      @javascriptmastery  2 роки тому

      Thanks Chad! Is that gravity falls on your profile photo? Smooth like butter a BTS reference? 😁

  • @learnearn8721
    @learnearn8721 2 роки тому +1

    we are really blessed with your channel thanks a lot man