[LIB] Framer Motion? Motion? - 웹 애니메이션 라이브러리

 

 

최근 React 프로젝트에 애니메이션을 추가하려다 Framer Motion의 공식 문서를 찾지 못해 의아했었습니다.

그러던 중, Framer Motion이 이제는 Motion이라는 이름의 독립 오픈소스 라이브러리로 변경되었다는 사실을 알게 되었죠.

 

---

👉 Framer Motion is now independent, introducing Motion

https://motion.dev/blog/framer-motion-is-now-independent-introducing-motion

 

---

 

해당 글에 따르면,

많은 유저들이 Framer Motion을 React.js 외의 환경에서도 사용하고 싶어 했고,

이에 따라 개발자 Matt Perry는 다음과 같은 결정을 내렸습니다.

“모든 사이트에서 애니메이션의 핵심 동인으로서 Motion의 미래를 보장하는 가장 좋은 방법은,
커뮤니티를 위한 독립적인 오픈 소스 프로젝트로 만드는 것이다.”

 

---

🔄 무엇이 어떻게 바뀌었나?

	Framer Motion	Motion
	Framer 제품군, React.js	독립 오픈소스
공식 사이트	framer.com/motion	motion.dev
주요 사용 환경	React.js 한정	React.js, Vanilla JS, Vue, Svelte 등
API 스타일	선언형 (motion.div, animate, exit)	선언형 + 명령형 (저수준 제어까지 가능)
기술 기반	React 렌더링 + Framer 의존	Web Animations API 기반 (WAAPI), Motion One 통합
번들 사이즈	상대적으로 큼	경량화 (Motion One 기술 통합)
운영 주체	Framer	Matt Perry + 커뮤니티 중심
재정 후원	Framer 내부 프로젝트	Framer가 공식 후원사로 잔존

 

 

✅ 결론

이제는 React가 아니어도, Motion을 사용하여 풍부하고 부드러운 웹 애니메이션을 구현할 수 있습니다.

https://motion.dev/

( 앞으로 6년정도는 계속 Motion을 계속 디벨롭할 예정인 듯! )