애니메이션1 [React] 숫자 증가 애니메이션 만들기 (with. TypeScript) 여러 웹 서비스를 이용하다 보면 숫자를 강조하는 방법 중 하나로 숫자가 빠르게 올라가는 애니메이션을 확인할 수 있습니다. 리액트를 이용하여 어떻게 구현할지에 대해 작성해보도록 하겠습니다. ❗️ 조건 1. 숫자는 0부터 시작해서 증가해야 합니다. 2. 숫자들이 주어진 시간 동안 증가하는 애니메이션을 보여주어야 합니다. 3. 시간이 흐를수록 숫자 증가량이 줄어들어야 합니다. (easeOut 효과) 📖 컴포넌트 및 변수 구성 컴포넌트와 변수는 해당 포스트 작성을 위해 임의로 작성된 내용입니다. 최종적으로 보여질 숫자와 텍스트를 변수로 저장하였습니다. 부모 컴포넌트를 하나 생성하고, 그 아래에 방문수, 좋아요, 댓글수가 보여질 컴포넌트를 반복문을 이용하여 생성하였습니다. type TyContents = [str.. 2022. 7. 7. 이전 1 다음