Scroll Trigger Tutorial - 8 - Using Scroll Trigger with React

แชร์
ฝัง
  • เผยแพร่เมื่อ 14 ธ.ค. 2024

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

  • @TheCodeCreative
    @TheCodeCreative  2 ปีที่แล้ว +1

    🎓 New Course Available! "Scrollytelling 101": store.thecodecreative.com/scrollytelling

    • @ttmmaacc
      @ttmmaacc ปีที่แล้ว +1

      where can i see what the projects are in this course????

    • @TheCodeCreative
      @TheCodeCreative  ปีที่แล้ว

      @@ttmmaacc Hi Tim, there are 5 previewable videos here to get an idea of some of the course content: store.thecodecreative.com/scrollytelling

  • @danialranjbar9805
    @danialranjbar9805 ปีที่แล้ว +3

    I really enjoy those expression sounds in between video slides. They r really funny. Thanks for the tutorial dude

  • @rahulpatil3942
    @rahulpatil3942 2 ปีที่แล้ว +2

    Thank you so much for this! I was trying to find this all over the forums and internet.

  • @goodstuff2read
    @goodstuff2read ปีที่แล้ว +1

    Everything I read says that the disappearing trick caused by pinning a trigger is because it needs gsap context wrapped around it. Do you have a video that covers this?

  • @CodeSuraZz
    @CodeSuraZz ปีที่แล้ว +1

    Helped to understand in very easy way

  • @TheChiaralyn
    @TheChiaralyn 2 ปีที่แล้ว +1

    Thank You!!! Hope to see other video likes this, GSAP is crucial!!!❤️🤩 Thank you again!

    • @TheCodeCreative
      @TheCodeCreative  2 ปีที่แล้ว +1

      Thanks! Just so you know, I have a full GSAP playlist here: th-cam.com/play/PLMPgoZdlPumexxtvuPUB3TY7LExI1N_Xp.html

    • @TheChiaralyn
      @TheChiaralyn 2 ปีที่แล้ว +1

      @@TheCodeCreative Thank you!!! I've saved your wanderful playlist! You deserve more and more su subscribers!

    • @TheCodeCreative
      @TheCodeCreative  2 ปีที่แล้ว

      @@TheChiaralyn 👍🏻👍🏻👍🏻

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

    Thank you Sir this is very helpfull for me

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

      Glad to hear that! Let me know if there are other topics you'd like me to do a video on.

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

      @@TheCodeCreative event handling make video on this

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

      @@jawadmdkhn Do you mean on the "this" keyword in general?

  • @kimbaproller4692
    @kimbaproller4692 2 ปีที่แล้ว +1

    should we use uselayouteffect or is useeffect the same?

  • @TheCodeCreative
    @TheCodeCreative  2 ปีที่แล้ว +1

    Download my FREE "Google Search Secrets for Developers" Cheat Sheet:
    store.thecodecreative.com/google-secrets-cheat-sheet

  • @TheCodeCreative
    @TheCodeCreative  2 ปีที่แล้ว +1

    Join "The Code Creative Community" group on Facebook: facebook.com/groups/thecodecreative

  • @TheCodeCreative
    @TheCodeCreative  2 ปีที่แล้ว

    👓 Blog Article for this video: www.thecodecreative.com/blog/using-gsap-scrolltrigger-with-react

  • @NNNedlog
    @NNNedlog 2 ปีที่แล้ว +1

    Thanks a lot. This was very helpful

  • @dannygroves6441
    @dannygroves6441 2 ปีที่แล้ว +5

    Hi, thanks for this content it was really helpful. Do you know how you can apply the animation to all child components without re-adding the effect in multiple components? I'm new to react so I may be missing something simple...

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

      Try to centralize your logic. :)

  • @user-ej8pf5bv1b
    @user-ej8pf5bv1b 2 ปีที่แล้ว +1

    If I have several elements, can I put them into one useRef and one useEffect? And I tried to add scrolling to a react function component it doesn't work. Do you know how to set it to an import child component?

  • @adamalfredsson2225
    @adamalfredsson2225 2 ปีที่แล้ว +1

    Don't forget to register the ScrollTrigger plugin

  • @corinnepradier8980
    @corinnepradier8980 2 ปีที่แล้ว +1

    Thanks a lot, this video is perfect 💘

    • @TheCodeCreative
      @TheCodeCreative  2 ปีที่แล้ว

      Thanks Corinne, glad it was helpful!

  • @rawrbearmedia1426
    @rawrbearmedia1426 2 ปีที่แล้ว +2

    Great video but I have a question. What do you do if you want to animate 2 logos on the same page?

    • @TheCodeCreative
      @TheCodeCreative  2 ปีที่แล้ว

      Thanks! You can use multiple useEffects to do that.

  • @iraybi
    @iraybi 2 ปีที่แล้ว +1

    Hi, thanks for this content but do you have any turorials or resources for how to use the scrolltrigger inside a nextjs/react component? Thanks

    • @TheCodeCreative
      @TheCodeCreative  2 ปีที่แล้ว +2

      Just this one on React. But maybe I should consider doing one for NextJS?

    • @iraybi
      @iraybi 2 ปีที่แล้ว

      @@TheCodeCreative That would be great. Please try to make the tutorial with multiple components and if possible then with routing too. Thanks!

  • @Edwardtonnn
    @Edwardtonnn ปีที่แล้ว +1

    Awesome!

  • @ProgrammingWithOsku
    @ProgrammingWithOsku 2 ปีที่แล้ว +1

    Thank You bro

    • @TheCodeCreative
      @TheCodeCreative  2 ปีที่แล้ว +1

      Thank you for watching!

    • @ProgrammingWithOsku
      @ProgrammingWithOsku 2 ปีที่แล้ว +1

      @@TheCodeCreative You are the best for people like me who have ADHD

  • @CarlWicker
    @CarlWicker ปีที่แล้ว +1

    GReat, thanks.

  • @TheCodeCreative
    @TheCodeCreative  2 ปีที่แล้ว +1

    To subscribe to the channel: th-cam.com/channels/mOpHGj4JRWCdXhllVTZCVw.html

  • @abujafarsiddique7635
    @abujafarsiddique7635 2 ปีที่แล้ว +1

    please make a play list on react js.please please please........i love your teaching method .

    • @TheCodeCreative
      @TheCodeCreative  2 ปีที่แล้ว

      Thanks! I have a React JS playlist here if you're interested: th-cam.com/play/PLMPgoZdlPumfmIqtGdD0mvVVNLBMcdI5a.html