i never used gsap but by what you're describing with gsap timeline i think you could do animation sequencing with the useAnimate() hook in framer motion. you'll be able to use the javascript 'await' keyword with it to wait for the animation to finish before continuing to the next animation which i think makes the code easier to read
@@SAIEN333 You can do that still. it runs the exact same synchronicity as the javascript youre declaring it with. So you can write awaits, pair things together, promises, etc. And all pf it just works.
@@SAIEN333 GSAP definitely makes this easier but you can do `await Promise.all([...])` and add delays depending on when you want them to run relative to each other.
Excellent videos, I love advice that end with "do both" because why NOT some feel like learning both is a sin y'all fellas got time to compete with elon musk yet waste it on brittle matters and disregard all the achievements you could've had in your spare time spare time is truly a bless, not everybody gets to spend it well thou
Nice video, thank you, I have a question, please answer me. It is impossible to make a page transition with the Next.js app router. Therefore, is choosing to use the page router the right approach or should transitions be abandoned? What do you think?
Hi bro, so i have got a task to make a animation where the page starts with a video and as we scroll down a mask should appear which is zoomed out as we scroll and video is still being played and can be seen through that mask, and when we continue scrolling it the mask goes to a place and is replaced by the logo eventually, any idea on how do it, i can dm u on discord if u dont get it.
for simple animations from a personal experience I really don't recommend both, again if your animations were not complicated just code them by yourself or go with a lightweight one like aos (animate on scroll)
Brother I love you mr content and its super amazing. I learned a lot from you as I am also just want to become like you. I just want to start my creative developer career please make a video on what only languages I have to study to create awwwards winning websites like you and what languages you have studied and worth for making animation only .... Please read it out ❤❤
Same with vue. I had 2 projects with vue and nuxt. Everything was working well until i did the SSG in nuxt. And animation stopped working on random elements. And i couldn't find any help
Why not use both ? I know it will contradict in the codebase and people will say it is not best practice. But if you know what you are doing, then it can work flawlessly in combination . Let me know if I am missing something and I am happy to learn. Thanks
Hey Olivier ! I loved this video . I work with entrepreneurs like you who have under 25k subscribers to help them to grow to 100k subscribers in under 12 months with proper systems . I actually helped Chirag to achieve 92k subscribers in under 11 months . Could I do a free audit to see if I can help you do the same ? I just think it's really important that more people see your content and want to help you on that mission .
![Seungmin "그렇게, 천천히, 우리(As we are)" | [Stray Kids : SKZ-PLAYER]](http://i.ytimg.com/vi/kAzmhLHePqU/mqdefault.jpg)
Man GSAP is a life saver for sequential animations, I don't think there's any other tool that made it easier to create them
true I do agree on that.
This dude is, THE DUDE! I learn so much with you, thank you so much, i really appreciate your work bro
i never used gsap but by what you're describing with gsap timeline i think you could do animation sequencing with the useAnimate() hook in framer motion. you'll be able to use the javascript 'await' keyword with it to wait for the animation to finish before continuing to the next animation which i think makes the code easier to read
What if i want the 2nd animation to play while 1st is already playing, like #% complete and trigger next animation
@@SAIEN333 You can do that still. it runs the exact same synchronicity as the javascript youre declaring it with. So you can write awaits, pair things together, promises, etc. And all pf it just works.
@@SAIEN333 GSAP definitely makes this easier but you can do `await Promise.all([...])` and add delays depending on when you want them to run relative to each other.
First time finding your channel and dude it's already standing out , thank you sm for your efforts
Man so much great content I subscribed. And I know ur going to make big on RUclips and life❤
What a thorough explanation, thank you 🎉
Love what you do bro, keep focusing on awwwards content❤️
Framer Motion has the useAnimate hook for creating timeline animations - is that comparable?
man blessed that i found this channel
Exactly what I needed 🔥
Can you create a complete guide/tutorial for gsap with react ?
yeah i need that too
@@RB_MAFIAyes shit thank you so much thank you this is just what I need
I have learned a lot from you thank you for such wonderful content
thank you so much! love the video
Very informative video. Thank you
Excellent videos, I love advice that end with "do both" because why NOT
some feel like learning both is a sin
y'all fellas got time to compete with elon musk yet waste it on brittle matters and disregard all the achievements you could've had in your spare time
spare time is truly a bless, not everybody gets to spend it well thou
Can you please create a whole Playlist for framer motion ? Step by step tutorial comprehensively
When is your course coming out? Very excited for it
Nice video. Are you planning to create a gsap course from scratch? That would be awesome
would you please make a crash course video for react framer motion ?
Please put a detailed video on locomotive smooth scroll or parallax animate I'm struggling or
feel like the learning curve for gsap is a little bit steeper but much more worth it, framer gives me trouble half the time.
how and where to learn GSAP?
Nice video, thank you, I have a question, please answer me. It is impossible to make a page transition with the Next.js app router. Therefore, is choosing to use the page router the right approach or should transitions be abandoned? What do you think?
Page transitions can be done in the template file. Not sure though, he has a video on it.
@@paakofibamfoquaicoe4193 Yes, correct entries are made, but exit animations are not made.
@@paakofibamfoquaicoe4193 Yes, correct entries are made, but exit animations are not made.
isn't the useAnimate hook from framer motion similar to gsap's timeline? What's timeline from gsap better at?
Thank you for this
If say this short: GSAP is a father, while Framer Motion is a newborn child
who is the mother ?
Thank you !
Any good arguments for or situations in which you ended up using both?
Thank you so much
Really nice. How can we make this work with the browser back and forwards buttons?
hi can you do a tutorial on page transition using framer motion and app router in nextjs
I don't think its possible in app router, I searched a lot for it aswell!
What does the license look like for GSAP if you’re at a company/business? How does that compare to framer?
Can you create a framer motion course?
What about react-spring? What's you thought on it?
🔥🔥🔥
Hi bro,
so i have got a task to make a animation
where the page starts with a video and as we scroll down a mask should appear which is zoomed out as we scroll and video is still being played and can be seen through that mask, and when we continue scrolling it the mask goes to a place and is replaced by the logo eventually, any idea on how do it,
i can dm u on discord if u dont get it.
really informational video, please what is the equivalent of framer for vue js
Try motion one
❤❤❤
bro, are your projects are responsive? cos last time i used your projects but not responsive
There's "motion one" an alternative to gsap by the "framer motion" team
for simple animations from a personal experience I really don't recommend both,
again if your animations were not complicated just code them by yourself or go with a lightweight one like aos (animate on scroll)
how and where to learn GSAP?
thanks
3:09 framer-motion
animate()
Brother I love you mr content and its super amazing. I learned a lot from you as I am also just want to become like you. I just want to start my creative developer career please make a video on what only languages I have to study to create awwwards winning websites like you and what languages you have studied and worth for making animation only
.... Please read it out ❤❤
We are waiting for his course
Missed ya bro, hope you are doing fine 🫂
I have used both but I will go for gsap all day
react-spring?
He's back!
Team Framer!
How can get constant freelance Job?. I really need job
I guess I'm learning gsap then 😅
You're GOD 🔥🔥🔥🔥
Then what about who created Gsap nad FM ?
AND what about who JS?
ND assembly?
Goated
Now framer motion becomes motion and you can use it with html
I just use both in a single proj 😅
Can anyone suggest me some channels that cover awesome content like this one? Thanks
Vanilla js css is best
Framer motion give laggy result sometimes on prod env 👎
I’ve noticed the same thing, even simple things like translateX animations are laggy.
agree 100%
Hi! Are you half Asian? 😃
GSAP lacks tutorials, making the developer experience not the best.
Specially with React & Next.Js
@@itsjmendezyep
Same with vue. I had 2 projects with vue and nuxt. Everything was working well until i did the SSG in nuxt. And animation stopped working on random elements.
And i couldn't find any help
@@itsjmendezexactly
Why not use both ? I know it will contradict in the codebase and people will say it is not best practice. But if you know what you are doing, then it can work flawlessly in combination . Let me know if I am missing something and I am happy to learn. Thanks
bundle size of your app will increase
@@shahrozahmed9746 by how much?
@@shahrozahmed9746 by how much?
@@shahrozahmed9746 by how much?
By how much?
Hey Olivier ! I loved this video . I work with entrepreneurs like you who have under 25k subscribers to help them to grow to 100k subscribers in under 12 months with proper systems . I actually helped Chirag to achieve 92k subscribers in under 11 months . Could I do a free audit to see if I can help you do the same ? I just think it's really important that more people see your content and want to help you on that mission .
gsap is not completely free
gsap is not open source lol