#library

[React] Framer Motion

오늘은 리액트의 애니메이션 라이브러리중 하나인 Framer Motion에 대해 작성해보겠다. Framer Motion을 사용하게 된 계기는, 방학때 진행했던 CATch Mind라는 디자이너 협업 퀴즈 게임 개발을 하다가, 연속적으로 나오는 애니메이션 구현을 위해 사용했다. 예를 들어, 캐릭터가 진화하는 장면에서, 기존의 캐릭터가 화면 아래로 내려가고 새로운 캐릭터가 올라와야 했다. 마치 포켓몬스터 진화하는 장면처럼 말이다. 이를 위해서는 DOM...