framer-motion [React] Framer-Motion으로 슬라이드 만들기(기본편) 공식 홈페이지: 이것저것 세련된 애니메이션 효과들을 쉽게 사용할 수 있습니다. styled-component를 사용하는 경우에는 styled(motion.html요소)로 작성합니다. 애니메이션 만들기 motion 컴포넌트의 prop을 넣어서 애니메이션을 적용합니다. animate : 애니메이션 효과 로 가면 다양한 애니메이션 효과들이 있습니다. 실질적으로 슬라이드를 담당하는 Box 컴포넌트가... Reactframer-motionTILanimationReact Framer Motion 시작하기 ) Framer Motion은 직관적인 코드를 통해 손쉽게 애니메이션을 제작하게 해준다. 우리는 이 props를 통해서 animation을 만들 수 있다. 🙄 Framer Motion은 Framer Component에 props를 전달하는 형식으로 애니메이션을 추가한다. motion.div , motion.span와 같은 형태로 Framer Component를 만들 수 있다. transiti... 리액트애니메이션framer-motion리액트 애니메이션framer-motion [Framer Motion]Toss Category motion Clone 토스 홈페이지에는 생각보다 많은 디테일이 숨어있는데 (작은 것 하나에도 motion이 들어감) 프론트를 처음했을 때는 어떻게 만들지..? 라는 생각을 자주 했었다. 요즘 공부하다보니 나도 할 수 있겠는데? 라는 생각이 들어 따라 만들어본 모션이다. 토스의 프론트 채용공고에 보면 기술스택에 Framer motion이 있는데 이 라이브러리를 활용해보았다. framer motion v5.0.0부터... framer-motionclonetossclone
[React] Framer-Motion으로 슬라이드 만들기(기본편) 공식 홈페이지: 이것저것 세련된 애니메이션 효과들을 쉽게 사용할 수 있습니다. styled-component를 사용하는 경우에는 styled(motion.html요소)로 작성합니다. 애니메이션 만들기 motion 컴포넌트의 prop을 넣어서 애니메이션을 적용합니다. animate : 애니메이션 효과 로 가면 다양한 애니메이션 효과들이 있습니다. 실질적으로 슬라이드를 담당하는 Box 컴포넌트가... Reactframer-motionTILanimationReact Framer Motion 시작하기 ) Framer Motion은 직관적인 코드를 통해 손쉽게 애니메이션을 제작하게 해준다. 우리는 이 props를 통해서 animation을 만들 수 있다. 🙄 Framer Motion은 Framer Component에 props를 전달하는 형식으로 애니메이션을 추가한다. motion.div , motion.span와 같은 형태로 Framer Component를 만들 수 있다. transiti... 리액트애니메이션framer-motion리액트 애니메이션framer-motion [Framer Motion]Toss Category motion Clone 토스 홈페이지에는 생각보다 많은 디테일이 숨어있는데 (작은 것 하나에도 motion이 들어감) 프론트를 처음했을 때는 어떻게 만들지..? 라는 생각을 자주 했었다. 요즘 공부하다보니 나도 할 수 있겠는데? 라는 생각이 들어 따라 만들어본 모션이다. 토스의 프론트 채용공고에 보면 기술스택에 Framer motion이 있는데 이 라이브러리를 활용해보았다. framer motion v5.0.0부터... framer-motionclonetossclone