Build and Deploy an Awwwards Winning Website | React.js, Tailwind CSS, GSAP

แชร์
ฝัง
  • เผยแพร่เมื่อ 13 ม.ค. 2025

ความคิดเห็น • 544

  • @Sunnyohaop
    @Sunnyohaop หลายเดือนก่อน +162

    bro is the kind of guy who tells consistency to be consistent

  • @mileslegend
    @mileslegend หลายเดือนก่อน +54

    YAY!!!! i have finished this build ..i coded along ..read the docs along i wont lie a 2hour video ..on building took almost 17 hours of actual coding 😵😵🤪🤪..i am, proud of myself ..thnaks for allowing me not get idle ..Big bro Adrian🤗🤗

    • @Paw_Oreo
      @Paw_Oreo หลายเดือนก่อน +1

      is it real ? or is there something to buy at the end or some what kind of thing?

    • @vaniad555
      @vaniad555 หลายเดือนก่อน +2

      @@Paw_Oreo it is real, but you might have to deploy it to Vercel unless you have hostinger hosting.

    • @javascriptmastery
      @javascriptmastery  หลายเดือนก่อน +2

      Nice work!

    • @mileslegend
      @mileslegend หลายเดือนก่อน

      @@vaniad555 true ..even onrender.....and firebase also netlify

    • @Demboys_p
      @Demboys_p หลายเดือนก่อน

      I'm stuck on 11:04

  • @sujoykrhaldar
    @sujoykrhaldar หลายเดือนก่อน +97

    Now start a series of awwards animated websites. There are very few channels cover this topic. And there are lots of devs want to dive into the artistic side of the frontend web development.

    • @javascriptmastery
      @javascriptmastery  หลายเดือนก่อน +15

      I completely agree!

    • @frontenddevs
      @frontenddevs หลายเดือนก่อน +1

      Yes please 🎉🎉
      Celebrate you Man 🥂

    • @sudhirdontha1053
      @sudhirdontha1053 หลายเดือนก่อน

      @@javascriptmasteryplease continue doing this series. You're work is truly inspiring!!

    • @mayckonm.rebecci7166
      @mayckonm.rebecci7166 หลายเดือนก่อน

      I completely agree!

    • @meneworon9878
      @meneworon9878 หลายเดือนก่อน

      Completely agree too

  • @arpitachakraborty9852
    @arpitachakraborty9852 หลายเดือนก่อน +13

    Man you just kill it! I am amazed to see this kind of website you are building and that is for free

  • @AnantDev925
    @AnantDev925 หลายเดือนก่อน +192

    If consistency is a human, then it is definitely Adrian

    • @javascriptmastery
      @javascriptmastery  หลายเดือนก่อน +14

      That means a lot, thank you!

    • @Om_Nagre
      @Om_Nagre หลายเดือนก่อน +4

      Seriously well said ❤🎉

    • @CharlesMizinga-w2z
      @CharlesMizinga-w2z หลายเดือนก่อน +2

      I 100% agree

  • @Om_Nagre
    @Om_Nagre หลายเดือนก่อน +25

    Hello Adrian we will be glad if you make this kind of more projects to target the creative agency ❤. Btw thank you for your work 😺

  • @CosmicTorben
    @CosmicTorben 5 วันที่ผ่านมา +1

    Just finished this in two full days.
    wow. just wow. It's a little over my current skills but I've learned SO much and this is going to look insane on any portfolio.
    Thank you !

  • @manas-yd9nh
    @manas-yd9nh หลายเดือนก่อน +7

    bro we upcoming developers request you to bring more of these, its literally a blessing for us to view content like this

    • @javascriptmastery
      @javascriptmastery  หลายเดือนก่อน +1

      So happy to hear! 😊

    • @ahmed_ade
      @ahmed_ade หลายเดือนก่อน

      ​@javascriptmastery, you are my best model. Love you

  • @Sneakingmentor
    @Sneakingmentor 3 วันที่ผ่านมา +1

    Perfect 👌🏼. Finished My first React native app. That tutorial was awesome 👍🏼

  • @baptistsamuel5977
    @baptistsamuel5977 29 วันที่ผ่านมา +4

    I just finished the course. Everything is advanced but understandable. I know better about gsap now, and I learned new tailwind CSS classes. The course is great but needs close attention. I learned more about animation and logic from everything, and it took me four days to finish. Thanks for the video.

    • @baptistsamuel5977
      @baptistsamuel5977 29 วันที่ผ่านมา

      The only problem i have is that the video in the hero section doesn't play on load until I play a new video.

  • @berkipekoglu
    @berkipekoglu หลายเดือนก่อน +25

    Awesome! More awwwards winning website design videos :)

    • @javascriptmastery
      @javascriptmastery  หลายเดือนก่อน +3

      More to come if this one does well!

    • @Beacon_and_Bard
      @Beacon_and_Bard หลายเดือนก่อน +2

      ​@@javascriptmastery bro please portfolio one .

  • @johnsonachuk
    @johnsonachuk หลายเดือนก่อน +7

    Just when u think the last project was the best ever, boom Adrian drops another banger❤

  • @eikyoutube
    @eikyoutube หลายเดือนก่อน +5

    This guy is INSANE
    How does he make so much content
    Truly unbelievable

    • @javascriptmastery
      @javascriptmastery  หลายเดือนก่อน +1

      I've got a team of great people!

    • @joker-zj5mo
      @joker-zj5mo หลายเดือนก่อน +1

      And you are the perfect commander ❤❤❤

  • @SubhraSekharGarai
    @SubhraSekharGarai วันที่ผ่านมา

    Awesome project, took me 5 days but still completed the project ,
    We want more videos like this sir

  • @exeis1052
    @exeis1052 หลายเดือนก่อน +1

    Naahhh this is the exact kind of video I've been looking for a long time. I've been watching you for a long time and never fail to amaze me. I hope you'll make more award winning site tutorials like this.

  • @hungnguyencanh5089
    @hungnguyencanh5089 หลายเดือนก่อน +8

    Don't rush to finish. Pause, reflect, and consider what the author is trying to convey. Thank you for your great content!

  • @prabhakardeep
    @prabhakardeep 29 วันที่ผ่านมา +1

    Great tutorial, finally completed the tutorial, it took me 12 hours to follow through the whole video.😂😂😂😂 Thanks, Adrain.🔥🔥🔥🔥🔥🔥

  • @kenshalom6098
    @kenshalom6098 หลายเดือนก่อน +4

    Your level excellence and consistency is a good leadership example worth emulating Thank You Adrian for your generous character

  • @Demboys_p
    @Demboys_p หลายเดือนก่อน +2

    Brother I saw u one week ago and your tailwindcss video on Nike shoe website helped me alot. I’m here to thank u and I can’t wait to learn more from u . I’ll keep sharing yo vids so other people can gain more from u aswel. May god bless u King 🐐

    • @javascriptmastery
      @javascriptmastery  หลายเดือนก่อน +1

      That's amazing, thank you so much!

  • @EnzzzoFarias
    @EnzzzoFarias 9 ชั่วโมงที่ผ่านมา

    no way you just delivered gold for us, already love you bro, God bless you

  • @abbasikoders-academy
    @abbasikoders-academy หลายเดือนก่อน +2

    I'm a huge fan of your channel and eagerly wait for each new project video! It's been two weeks now, and I can’t wait to see your latest Next.js project uploaded. Every time I think I’ve seen it all, you come out with something even more impressive. I'm so glad to be a subscriber! 😅

  • @Beardyman5617
    @Beardyman5617 หลายเดือนก่อน +1

    Man, your content is next level! You’ve mastered the balance of quality, value, and entertainment. Keep doing what you’re doing-your videos are a goldmine!😁

  • @potatonotbruh
    @potatonotbruh หลายเดือนก่อน

    i just went through making an app for my project and now i have another project and this man delivers

  • @TheDarkopsis
    @TheDarkopsis หลายเดือนก่อน

    I join everyone in saying MOOORE of Awwward winning websites hahaha I'm so excited seeing this. Seeing how a person would code those website step by step for free on the internet is absolutely amazing and great advertising for your courses ! Keep up the good work !

  • @adrianlouis2108
    @adrianlouis2108 หลายเดือนก่อน +1

    Bro where were you my entire life? Damn If i knew your channel existed . MAn I will for sure buy your course.

  • @ChristineGuyoDonche
    @ChristineGuyoDonche หลายเดือนก่อน +1

    Adrian Adrain You never cease to amaze much love from Kenya, consistency on the next level

  • @almudenarf1148
    @almudenarf1148 หลายเดือนก่อน

    I cannot believe this content is for free. Thank you so much for this video, it is one of the most beautiful websites I have ever seen!!

  • @pachimari8
    @pachimari8 หลายเดือนก่อน

    I must say that I’ve always loved your tutorials they’re so well done and easy to follow!I had to try this one as soon as I saw it pop on my feed and I just finished watching it. It turned out amazing, and I learned so much along the way. You’re a really great teacher and all your videos are always a joy to watch. Thanks for all the effort you put into them!

    • @javascriptmastery
      @javascriptmastery  หลายเดือนก่อน +1

      Thank you so much, it means a lot!

  • @loganathanspr
    @loganathanspr 15 วันที่ผ่านมา

    Thank you Adrian. This is an incredible tutorial from you and the website is nothing short of stunning.

  • @paperfly178
    @paperfly178 หลายเดือนก่อน +2

    Woahhhh This is what I'm exactly searching for. You are great Adrian. Thanks for this

  • @zvikomboreromugwara5265
    @zvikomboreromugwara5265 หลายเดือนก่อน

    This website is incredibly impressive. I never thought it would be possible for me to make one. I've learned so much from you Adrian, God bless you

  • @Muhammad-Shahab
    @Muhammad-Shahab หลายเดือนก่อน +1

    Your tutorials have been incredibly inspiring and informative! 🌟 It would be amazing to see a comprehensive video on building high-level full-stack applications with a focus on clean architecture, organized folder structures, and advanced features like role-based permissions.

  • @Ejjay-j1b
    @Ejjay-j1b หลายเดือนก่อน

    "Hi Sir Adrian! I'm a complete beginner, but I’m really looking forward to the 'Image Gallery App' tutorial because I absolutely love your design style and the way you put everything together. It's always so clean and visually appealing. Thank you so much for all your hard work and for sharing your knowledge with us. Your tutorials are invaluable, and I appreciate everything you do! 🙌😊"

  • @TNT_PEROX
    @TNT_PEROX หลายเดือนก่อน +2

    This type of content can only be delivered by Adrian amazing bro ❤

  • @amitavasengupta5580
    @amitavasengupta5580 หลายเดือนก่อน +2

    Bang! This guy knows the perfect way to start my weekend

  • @prerakpatel3165
    @prerakpatel3165 หลายเดือนก่อน +1

    Amazing. Mind Blowing. Can't wait to finish my current project and start working on this one.

  • @P_venom
    @P_venom หลายเดือนก่อน +1

    Bro you just changed the course of my life .....
    If I can do this I'd drop my portfolio here in like 2weeks time ❤
    ...

  • @TahaJSDev
    @TahaJSDev หลายเดือนก่อน +1

    When i see Adrian's videos it motivates me to learn more
    thank you Adrian

  • @hamza201183
    @hamza201183 หลายเดือนก่อน +2

    Thank you very much Adrian. Indeed it's great time to time to have some videos about creative HTML/CSS, not necessary with BackEnd stuff :)

  • @goodchoice9562
    @goodchoice9562 หลายเดือนก่อน +1

    Thanks so much for all the amazing projects you bring to your platform. Your explanation is out of this world 🌎. Thanks again Mr Adrian

  • @madhurikutre8868
    @madhurikutre8868 หลายเดือนก่อน +1

    React and tailwind combination will be always have place in my heart ❤️ btw great project

  • @juniorMr
    @juniorMr หลายเดือนก่อน

    Another banger 🎉
    Congratulations Adrean

  • @Rosniel-fm2gb
    @Rosniel-fm2gb หลายเดือนก่อน

    From cuba we watch your videos, we love it. Thanks for all teacher!

  • @Daniel-sx4qc
    @Daniel-sx4qc หลายเดือนก่อน

    bro, we really need this to be on the playlist. great videos !

  • @jehnzcode
    @jehnzcode หลายเดือนก่อน +1

    Now my weekends plans are cancelled because of this new amazing tutorial👏

  • @pperfectdev
    @pperfectdev หลายเดือนก่อน +3

    Adrian is the best. I appreciate you

  • @krushnachandrasahu2744
    @krushnachandrasahu2744 หลายเดือนก่อน +7

    When are you planning to drop the React Native app video?

  • @MrIsGrowing
    @MrIsGrowing หลายเดือนก่อน +1

    mind blowing project yet again from the best guide on youtube thanks alot adrian this is an awesome project but i have been waiting for a full stack e commerce store i hope you make it soon
    and also Lots of love to you and your work

  • @saqlain0902
    @saqlain0902 หลายเดือนก่อน

    I can't resist myself for building this one thank you so much Adrian ❣️

  • @PutuAdityaLab
    @PutuAdityaLab 2 วันที่ผ่านมา +1

    inspirationall thank u my broo 😍

  • @OPGAMER.
    @OPGAMER. หลายเดือนก่อน +3

    Amazing. Starting this project right now.

  • @segalgbenou975
    @segalgbenou975 หลายเดือนก่อน

    I've been reloading the TH-cam page since then, I've been waiting, thank you ! 🚀🌟✨

  • @davidadedeji3018
    @davidadedeji3018 หลายเดือนก่อน

    Mehn you're so good at it and its waking the creativity in me

  • @tonim9
    @tonim9 หลายเดือนก่อน

    Great one Adrian 😊. Wish to see more gsap videos. Counting to one million subscribers ⏳

  • @Way_Of_The_Light
    @Way_Of_The_Light หลายเดือนก่อน +1

    HOLY COW ✨✨✨✨ you’re the king 👑

  • @marvelpro06
    @marvelpro06 หลายเดือนก่อน

    Way to go Adrian!!! suprising us everytime with something new. You are truly one of a kind😉😉😎😎❤❤😍😍❤❤

  • @A_M_R_2004
    @A_M_R_2004 หลายเดือนก่อน +6

    I think if you keep focusing on awwwards rebuild you will hit that fr fr fr

  • @vaniad555
    @vaniad555 หลายเดือนก่อน

    Another amazing video. We ask you deliver. Thank you for all your hard work!

  • @Jishanthegodev
    @Jishanthegodev หลายเดือนก่อน

    Dude, Adrian just dropped another banger.

  • @programmingwithvusala
    @programmingwithvusala หลายเดือนก่อน

    omg thanks this is the video i was searching for. keep it up , u are amazing

  • @cryptodemon3421
    @cryptodemon3421 หลายเดือนก่อน +9

    I'm retired at 27, went from Grace to Grace. This video here reminds me of my transformation from a nobody to good home, honest wife and 35k biweekly and a good daughter full of love

    • @ArthurTuttacastilho
      @ArthurTuttacastilho หลายเดือนก่อน

      As a beginner what do I need to do? How can I invest, on which platform? If you know any please share.

    • @ArthurTuttacastilho-tm5pb
      @ArthurTuttacastilho-tm5pb หลายเดือนก่อน

      Waking up every 14th of each month to 210,000 dollars it's a blessing to I and my family... Big gratitude to Sofia Duke 🙌🏻

    • @M2recoveryLimited
      @M2recoveryLimited หลายเดือนก่อน

      Yeah, 253k from Sofia Duke, looking up to acquire a new House, blessings.

    • @DoubleMaduagwu-sb4kp
      @DoubleMaduagwu-sb4kp หลายเดือนก่อน

      Stawrted with 5,000$ and Withdrew profits
      89,000$

  • @Catador-de-videos
    @Catador-de-videos 19 วันที่ผ่านมา +1

    I would love to see more Gsap and ThreeJs videos.

  • @Kartik_py
    @Kartik_py หลายเดือนก่อน +1

    bro you just keep inspiring me again and again

  • @Warrior4Christ1945
    @Warrior4Christ1945 หลายเดือนก่อน +1

    Love the vids super helpful thank you so much Adrian!

  • @KamranJamal-r2i
    @KamranJamal-r2i หลายเดือนก่อน

    Can not wait for others please do more you are gem in web dev on yt love you from pakistan ❤❤❤

  • @shahnoormujawar6825
    @shahnoormujawar6825 หลายเดือนก่อน +2

    Adrian keep it up and please think to launch some back-end heavy projects in future on nodejs typescript and postgress we really need that ❤

  • @amberforrester.m
    @amberforrester.m หลายเดือนก่อน

    Thank you for another incredible tutorial! Absolutely incredible :D

  • @devilsh8273
    @devilsh8273 หลายเดือนก่อน +2

    This video is a true gem ❤

    • @javascriptmastery
      @javascriptmastery  หลายเดือนก่อน

      Thank you! ❤️

    • @devilsh8273
      @devilsh8273 หลายเดือนก่อน

      Bro i recently completed a course in react and yt algorithm shows this. Love you man and love your work ❤️

  • @samiulalim6894
    @samiulalim6894 หลายเดือนก่อน +2

    wow, I am searching for this kind of Awwwards website and today you came with this. thank you so much. Want more projets on awwwards website plz.

  • @hanialazreg9953
    @hanialazreg9953 หลายเดือนก่อน

    Adrian, you are the best , no more words

  • @i_vishalsah01
    @i_vishalsah01 หลายเดือนก่อน

    that look sick!!!! superb build 😍😍😍

  • @oyegokeamina5864
    @oyegokeamina5864 หลายเดือนก่อน

    Thank you Adrian
    Whenever you feel desperate searching for something, Adrian has already made a video. Standing ovation for this engineer!

  • @saifullahkhan2685
    @saifullahkhan2685 หลายเดือนก่อน +1

    was just searching for this!! thanksss

  • @thundervasanth7011
    @thundervasanth7011 หลายเดือนก่อน

    We are very very grateful for this aAdrian sir,You are my best tutor for full stack development.And there is no tutor or mentor like you in youtube or any platform.I love your content and i am gonna create this project because of this animation and gsap(i love gsap).I was really wondered how this kind of animated websites are creted.but now i am gonna create this .I am also future level developer because of you Adrian sir.We are grateful for your work.And Advance congratulations for ! million subscriber.You deserve this 👑 Sir.
    Request:We need complete gsap tutorial too.For pro level websites

  • @TheStRaX_
    @TheStRaX_ หลายเดือนก่อน

    The best project ever I am going to build.

  • @baptistsamuel5977
    @baptistsamuel5977 หลายเดือนก่อน

    Perfect video i have been looking for👍👍

  • @SimaDutta-w6t
    @SimaDutta-w6t หลายเดือนก่อน

    Really Adrian wins everyone's heart ❤️

  • @senlee325
    @senlee325 หลายเดือนก่อน

    This is just what I was looking for to update my website 🌟

  • @himanshumanitripathi7261
    @himanshumanitripathi7261 หลายเดือนก่อน +3

    Animation websites have best impression. Thanks❤

  • @АркадийСамохвалов-к7ъ
    @АркадийСамохвалов-к7ъ 11 วันที่ผ่านมา +1

    I was impressed at first, but the further I looked, the more I realized that you yourself lack the experience to repeat this. The further from the first section, the less it resembles the original.
    In any case, thanks, it helped me see where to start.

  • @PrajWal__sh
    @PrajWal__sh หลายเดือนก่อน

    Love you bro genuinely from the bottom of my heart ❤❤❤

  • @hfg16
    @hfg16 หลายเดือนก่อน

    You will never stop amaze me with those videos I will create this one fire website for sure thanks a lot

  • @priyanshupaul4215
    @priyanshupaul4215 หลายเดือนก่อน

    I have to say Award winning video 🎉❤

  • @Vivek2.0-pv4rh
    @Vivek2.0-pv4rh หลายเดือนก่อน +1

    Can you create a part 2 where you complete the other remaining sections of the zentry site. That would be so cool. Doing this one project completely will allow us to build any other complex site.

  • @benzlozada392
    @benzlozada392 หลายเดือนก่อน

    Thank you JSM I love the way you teach

  • @shadowslayer2248
    @shadowslayer2248 หลายเดือนก่อน +2

    Crazzzzzy shit! This guy will surely put some Web Design Agencies out of business. Even though it's a single webpage, he could have sold this for a large price and a lot of agencies actually do this and charge a lot but this person is giving it out for free! Massive Respect!!!! 👍👍🫡

  • @shoaibshuja2004
    @shoaibshuja2004 หลายเดือนก่อน +2

    Okay this might get me hired for sure😺

  • @garislit
    @garislit วันที่ผ่านมา

    awesome man! thank you so much. you kill it 🔥

  • @YousufJusani
    @YousufJusani หลายเดือนก่อน +1

    Damn, This is Dope! 🥵❤‍🔥😍🔥
    Please make a series on zentry website which includes not only all sections, but also Adrian special some extra new sections and features 🤩

  • @Usama_Uk
    @Usama_Uk หลายเดือนก่อน +1

    I really like your videos you are great teacher❤😊

  • @robpro1024
    @robpro1024 หลายเดือนก่อน

    Adrian thank you for sure you inspire my development journey

  • @deseanward8566
    @deseanward8566 หลายเดือนก่อน +1

    Can't wait to get started

  • @LocksVid
    @LocksVid 25 วันที่ผ่านมา +1

    10/10 tutorial, just finished the hero section now. Only problem is that the clicking video animation isn't like the original, it doesn't zoom into the new one it abruptly changes, I will try to see if I can implement that myself and let you know if I find a solution

    • @militov78
      @militov78 20 วันที่ผ่านมา

      you can solve it?

  • @10zDelek
    @10zDelek หลายเดือนก่อน +2

    Weekend about to get lit

  • @IrfanB-jq1nt
    @IrfanB-jq1nt หลายเดือนก่อน

    We want more content like this ❤

  • @SharifRayhanNafi
    @SharifRayhanNafi หลายเดือนก่อน +1

    now this is the real stuff!! thanks man. Hope you’ll be making more tutorials on websites like this 🤍

  • @marekgacekdev
    @marekgacekdev 14 ชั่วโมงที่ผ่านมา

    thanks a lot, cool website and awesome tutorial!

  • @TriumphantGideonUbuake
    @TriumphantGideonUbuake หลายเดือนก่อน +1

    You will soon reach 1million Sub! I promise

  • @d.ee_lad
    @d.ee_lad หลายเดือนก่อน +1

    This project will be so great

  • @AkhilMalviya03
    @AkhilMalviya03 หลายเดือนก่อน

    finally i complete this project is amazing to create this thank you so much 😇

    • @shreychaudhary9786
      @shreychaudhary9786 หลายเดือนก่อน

      i am stuck at 37:41 after coding out 3 only two is playing and one video just skipped without loading at background
      import { useRef, useState } from "react"
      const Hero = () => {
      const [currentIndex,setCurrentIndex] = useState(1);
      const [hasClicked,setHasClicked]=useState(false);
      const[isLoading,setIsLoading]=useState(true);
      const[loadedVideos,setLoadedVideos]=useState(0);
      const totalVideos = 3;
      const nextVideoRef = useRef(null);
      const handleVideoLoad=()=>{
      setLoadedVideos((prev)=> prev + 1)
      }
      const upcomingVideos = (currentIndex % totalVideos) +1;
      const handleMiniVdClick =()=>{
      setHasClicked(true);
      setCurrentIndex(upcomingVideos);
      }
      const getVideoSrc =(index)=>`videos/hero-${index}.mp4`;
      return (













      )
      }
      export default Hero