
[React] 스크롤 애니메이션을 구현하는 다양한 방법을 알아보자
·
Web/React
리액트 기반 세로로 배치된 5개의 이미지들을 사용자가 스크롤함에 따라서 나타나도록 애니메이션을 구현해봅시다~!먼저 리액트에서 애니메이션을 구현하는 방법은 다양하게 존재하지만, 외부 라이브러리를 사용하지 않는 방법과 기본 API만 사용하는 방법을 포함해 총 3가지로 구현해보았습니다. Result깃허브 링크: https://github.com/abyss-s/react-scroll-animation배포 링크: https://react-scroll-animation-orcin.vercel.app/ 1. IntersectionObserverIntersectionObserver는 순수 JavaScript API로, 라이브러리에 의존하지 않고도 스크롤 애니메이션을 구현할 수 있습니다. Intersection Obse..