O que é Framer Motion?
Definição
Framer Motion é uma biblioteca de animações para React que oferece uma API declarativa baseada em componentes. Permite criar transições, gestos e animações complexas com poucos atributos.
Utiliza o conceito de variants para orquestrar animações em árvores de componentes, com suporte a spring physics, keyframes e animações baseadas em scroll ou layout.
Exemplo Prático
TypeScript
import { motion } from 'framer-motion';
const Card = () => (
<motion.div
initial={{ opacity: 0, y: 20 }}
animate={{ opacity: 1, y: 0 }}
exit={{ opacity: 0 }}
whileHover={{ scale: 1.05 }}
transition={{ type: 'spring', stiffness: 300 }}
/>
);Quer ver Framer Motion em ação em projetos reais?
Ver artigos sobre Framer Motion