Complex Animations Shouldn't be SO Hard | Framer Motion + useAnimate

We will use the useAnimate hook from Framer Motion and create a complex animation.
⏳ Timestamps
00:00 - Introduction
00:32 - What we will build
01:44 - Setting up
04:34 - Animating
👨‍💻 Looking for a web developer job, visit: www.webdevjobs.io/
👽 Discord - / discord
👾 Code - github.com/sixfwa/subscribe-b...
#framermotion #reactjs #animations

Пікірлер: 16

  • @asadansari8908
    @asadansari89083 ай бұрын

    This channel's gonna blow up...... Amazing content and great example

  • @iamrithmic

    @iamrithmic

    3 ай бұрын

    Thanks a lot!

  • @farzadmf
    @farzadmf3 ай бұрын

    So cool!!!

  • @iamrithmic

    @iamrithmic

    3 ай бұрын

    As always, thank you man!

  • @farzadmf

    @farzadmf

    3 ай бұрын

    Thank YOU for the great videos!

  • @dhidhi1000
    @dhidhi10002 ай бұрын

    if only the docs had this example...

  • @godofwar8262
    @godofwar82623 ай бұрын

    Great videos

  • @iamrithmic

    @iamrithmic

    3 ай бұрын

    Thanks man!

  • @sohrabkhan101
    @sohrabkhan1013 ай бұрын

    Hey there! I've been thinking, what if we try something different instead of using async await? We could opt for a sequence array approach, like this: const sequence = [ ["ul", { opacity: 1 }, { duration: 0.5 }], ["li", { x: [-100, 0] }, { delay: stagger(0.1) }] ]; animate(sequence, { duration: 10 }); Also, regarding the hover state for buttons, instead of creating isCursorLoaded and setIsCursorLoader states, why not simply apply a Tailwind CSS class like opacity-0. I think it'll give our project a cleaner and cooler look. What do you think? 😊🚀

  • @iamrithmic

    @iamrithmic

    3 ай бұрын

    Good stuff, but I think with the array we could be sacrificing readability and with the cursor, it still needs to be loaded. If I understood that last part correctly

  • @nanonkay5669
    @nanonkay56693 ай бұрын

    👏👏👏👏👏

  • @digitalsahara6670
    @digitalsahara66702 ай бұрын

    great tutorial man, loved it. was wondering whether you can explain how to do page transition with the app directory? I was looking all over for it but cant find one so far, are there any workarounds ?

  • @p1erceprc
    @p1erceprc2 ай бұрын

    Amazing content! may I ask what theme are you using? Thanks

  • @Foo678
    @Foo6783 ай бұрын

    Nice video!!!, is this like gsap timeline?

  • @iamrithmic

    @iamrithmic

    3 ай бұрын

    Yes similar, but you don't have the structure that comes with GSAP

  • @mayurbansal4051
    @mayurbansal40513 ай бұрын

    which color theme are you using