If anyone is getting errors when installing node packages, it's probably node-sass. In the package.json remove node-sass and install dart sass instead with a 'npm install sass'. Also Framer Motion now requires React 18 or greater, so you'll need to update your React version as well
@@benreimer2090 Too many errors to describe, try to follow along with the first 3 minutes and you will see. It has something to do with create-react-app being deprecated. This is a pretty outdated build pipeline. Maybe you could redo the demo
Omggggg your back from the dead broooooooooo I missed you so much mann. Your videos are beat in this niche in RUclips. I really appreciate the link u put for text cause sometime i get stuck with some of ur tutorials. Man keep up with the fire 🔥 #1 fan
@@WrongAkram just still grinding trying build an get out of tutorial hell but I don't if I'm watching ur videos lmaoo. But bro I miss ur videos it really refreshing to see ur content. I cant for more of ur videos hell once I finally get job in the field I'll pay for the subscription. Still ur #1 fan keep up with the fireee🔥
Awesome video, very inspiring, so glad to learn so much. One thing i found that if i use the ease[[0.6, 0.01, -0.05, 0.95]] for Image blocks, the animation didn't happy, once i change the -0.05 to 0.05, it works...is that a bug of framer motion ?
Do you have a tutorial showing how to click an image and it opens larger to a new page (like clicking an image of a cases study, then it transitions into the hero image of a case study page?)
Your techniques are so valuable to learn, but more than anything in all of your videos I'm struck by how beautiful the base designs are. I'd love to get some video tutorials from you on how you design your sites, and scaffolding all the base css you put into the start code. It's all well and good knowing how to stagger children, but if you've got an ugly site then it means nothing.
Does anybody else has the same issue: after cloning the repo and running "npm i && npm start" the page won't load, it says: "Unable to connect". Trying to figure out why.
Wrong, i ve being trying to build something a cards,that overlaps each other from the left and right,and that can be swiped,clicked to view the contents,but i ve being struggling with it, please can you just help me out
You're giving "cointainer" to the motionDiv, and you're also setting initial and exit properties for that div even thought "container" doesn't have those. Is that right?
![Blox Fruits Dragon Rework Update [Full Stream]](http://i.ytimg.com/vi/EqDAp8udhm0/mqdefault.jpg)
He returned when the world needed him the most.
🙏🏽
Yay He is back!
You know it
Your videos are a BLESSING. Thanks for coming back! :)
Holy content 🙏🏽
What you do is really exceptional, thank you for sharing with these tutorials and your time!
Glad you think so!
What an insane video, thank you for everything you do. Hope your break went well
Thanks for asking! Yep went pretty well, really glad you enjoyed the video’
Welcome back dude!
Hey hey! Thank you!
I miss this guy so bad
Back with a bang 💣🙌
Bang bang!
Welcome back king 👑, please always bring that kinda stuff. It really helps a lot! ❤️
Quality is soo good, hope to make this level of content in future 💙
Your work is sick! If you want to start making tutorials, feel free to ask away on any questions you may have!
Best react tutor, finally back with a banggg!
I hope you had a good break. Glad to have you back 🤗
So happy to see you back.
:)
Never knew this thing existed till I bumped into your video. Thank you for making all these videos. I'm a fan :)
this is my fave channel, thank you for the tutorials!
The framer motion series is da best!
Framer motion is 🔥
Thanks for coming back
You bet!
Keep 'em coming they're like little gems - thank you!
Oh! Thanks, you are back!
Welcome back 🤟
Thank ya!
I love the new style of presentation. Everything is appropriately big and precise. Missed your videos the most, Akram! Thank you for your time!
sooooo happy to see you back 💯🔥
Thanks for having me back
Dang, its been 2 years, i hope you come back again with another great video again
Hands down the best RUclips channel for coding the best designs and animations 👌
Appreciate that!
Thank you so much brother. My Components are now very clean using this method.
your changing my boring webdev UI skill into something new. THANKYOU SOMUCH😇🙏🙏
gald you're back
Great tutorial man, love the pace ande details. Keep them coming please!
Thanks, will do!
finalllyyyyy!! hes back!
you make it looks so easy -___- hats off!
Missed the videos! This is awesome, I didn't know framer motion had this to offer!
My man! Yep, it’s pretty wild
Content is flawless !
oof flawless.... love that word :)
Great video! Will u ever do a Framer Motion - Beginner to Advanced tutorial? There are not many of them on here.
Been thinking about it
@@WrongAkram plzzzzzzzzzzzz
Please do it
This is so clean
we missed you
Man, you are a magician!!!
Finally, You're Back.
Good to be back!
Cool as always man!
It be like that
top notch as always 🔥🔥
Thank you!
If anyone is getting errors when installing node packages, it's probably node-sass. In the package.json remove node-sass and install dart sass instead with a 'npm install sass'. Also Framer Motion now requires React 18 or greater, so you'll need to update your React version as well
I have tried this and I still can't figure it out, really hoping someone can help me out here
@@Madewillarts I haven't looked at this in awhile but might be able to help - what error do you get, and when in the process?
@@benreimer2090 Too many errors to describe, try to follow along with the first 3 minutes and you will see. It has something to do with create-react-app being deprecated. This is a pretty outdated build pipeline. Maybe you could redo the demo
I love these videos man, thanks for your hard work.
Glad you enjoy them!
Omggggg your back from the dead broooooooooo I missed you so much mann. Your videos are beat in this niche in RUclips. I really appreciate the link u put for text cause sometime i get stuck with some of ur tutorials. Man keep up with the fire 🔥 #1 fan
My man! Always there for support! How’s life been?
@@WrongAkram just still grinding trying build an get out of tutorial hell but I don't if I'm watching ur videos lmaoo. But bro I miss ur videos it really refreshing to see ur content. I cant for more of ur videos hell once I finally get job in the field I'll pay for the subscription. Still ur #1 fan keep up with the fireee🔥
damn... some high quality shit right here. keep up the fantastic work !👌🏻
🔥🔥🔥 watched some of your old videos and just came here to say its awesome. Great job 👏
Awesome video, very inspiring, so glad to learn so much.
One thing i found that if i use the ease[[0.6, 0.01, -0.05, 0.95]] for Image blocks, the animation didn't happy, once i change the -0.05 to 0.05, it works...is that a bug of framer motion ?
Awesome video, great explanation. Thanks man!
This is real kool and detailed tutorial. Thank you.
He bacc!
big bac
Awesome ! 🙌
wow beautiful
Super bro. I can't imagine these kind of animations done in react.
Welcome back again
My twin, what’s good man!
i love your tutorials
Bro long time no see...welcome back
Glad to be back
Awesome! The best resource for learning Framer Motion and SharedLayout. Hope you do a new Awwwards series soon!!
Welcome back :)
Thank you 🙏🏽
Welcome baaaack.
Thanks!
Welcome Back...🔥
Glad to be back!
Excellent video :D
Tutorial starts at 4:50
Do a video on starter files you use like build something like this from scratch for once Please!!
and more of awwwards series we want.
🤔
Yeah those starter files made me dizzy
Do you have a tutorial showing how to click an image and it opens larger to a new page (like clicking an image of a cases study, then it transitions into the hero image of a case study page?)
Thank you for this. Please more framer motion tutorials!
Another one on 🔥🔥🔥🔥🔥
Say it louder for the people in the back!!!
This is brilliant! Would love to see how framer and redux work together 🙏
Redux is pretty neat but jotai looks like super cool!
@@WrongAkram oh hell yeah! You reckon you'd do a tut on it? sweet-state is usually my go to but this looks hectic
Maybe i'm missing something but how the hidden,show, exit animations work on container variants since they've been declared inside item variants.
this such an amazing video for me it show me how the motion work in advance .I expected you would make more good video like this again 🙂
@wrongakram - thanks so much for this. Is there anyway to apply this to websites built in the Framer tool?
Love your stuff
Glad you love it!
ayyy my man's back again
back 2 back
Your techniques are so valuable to learn, but more than anything in all of your videos I'm struck by how beautiful the base designs are. I'd love to get some video tutorials from you on how you design your sites, and scaffolding all the base css you put into the start code. It's all well and good knowing how to stagger children, but if you've got an ugly site then it means nothing.
did you got one?
Dear God, Can you make more and more and more, thank you for everything you do!!!!
Does anybody else has the same issue: after cloning the repo and running "npm i && npm start" the page won't load, it says: "Unable to connect". Trying to figure out why.
You are what they call hero.
Where my cape at?
You inspired me to be a better developer. Thank you 💯🔥 🚀 👏🏾 🙏🏾
Wow! Super happy to hear that :))
how do you come up with those values for ease function 7:49 what tools do you use if any to find the best attributes for the animation
In the framer motion container element the initial and animate prop you passed into it was not defined. I didn't see were you defined it
how do you get the fiels and images from dribble?
hello there will be current videos when you return to youtube are you missed in these parts?
Hey, looks like this tutorial no longer works to follow along. Anyone find out how to fix it?
I wish you showed the end result of the part that you're adding first so that I know what you're trying to do before you write the code
Wrong, i ve being trying to build something a cards,that overlaps each other from the left and right,and that can be swiped,clicked to view the contents,but i ve being struggling with it, please can you just help me out
How to get the displayed size of imported packages in gzip?
Cool! how to apply this in Squarespace?
Please do more framer motion videos
Hi, Can you help me with creating other pages and linking them to header 🙂 ?
Thanks for the lesson. Is it possible to repeat such an animation without using react, but using javascript? For example GSAP?
How you created the effect in terminal when you are typing the command? I really liked that.
You are a gem♥️ my friend
Lovely tutorial. What is the VS Code intellisense plugin for Framer Motion to show properties/keys?
I founded a gem today 🤩
thanks, @Wrong Akram
Welcome!
what is that confetti effect on your terminal?
You're giving "cointainer" to the motionDiv, and you're also setting initial and exit properties for that div even thought "container" doesn't have those. Is that right?
BAM!
Bam Bam 💥
incredible stuff man! Can you make a tutorial on an animated vertical timeline using framer?
The Best 👌
do you need to different y values for mobile?
Asewome!
🕵🤔
Is there any npm package to convert png to webm??
sir can you tell whats the difference between path spacing , path offset
in framer motion what the exact use of it in svg animation
RUclips doesnt even know how to handle your quality, yet... soon 1m subs