Professional Button Hover Animation w/ ReactJS + Framer Motion

In this video I will be recreating a button hover animation I saw on Olivier Larose's blog. I think this animation is really clean, follow me along as I talk you through how I recreated it using TypeScript, Framer Motion, React, NextJS and CSS.
Inspiration from / @olivierlarose1
Olivier's blog: blog.olivierla...
Framer Motion: www.framer.com...
React: react.dev/
NextJS: nextjs.org/
HeroIcons: heroicons.com/
Instagram: / code__james
TikTok: / codejames

[@wasiullahkhan9685]

this is so cool! and even cooler the sound of your keyboard, can you share the model? it sounds so creamy!

[@code__james]

Haha thank you! Yeah sure, it’s the AJAZZ AK816 PRO 😊

[@robimuhammad95]

Cool bro, I will give a shot to framer motion.
But why didn't you use button tag instead?

[@code__james]

@@robimuhammad95 You could use a button tag, and maybe you should (I’m not sure) But buttons come with some default styling already that you would have to overwrite so it was easier to use a div

[@robimuhammad95]

@@code__james oh I got it. But yeah bro if you want good SEO, button tag is a must

[@code__james]

Thank you! You won’t catch me doing it again 🤓

[@f0rsythic]

Yooo thanks bro 🤗🤗

[@code__james]

No worries! Happy to help 😊