Age of Discovery

https://jurgen-94.tistory.com/93 [React] - Intersection Observer로 무한스크롤 (1) 프로젝트 내에서 무한스크롤을 구현하기 위해 Intersection Observer API를 사용했으며 그 원론적인 상세내용은 React 무한 스크롤 구현하기 with Intersection Observer 🔥🔥 Intersection Observer API를 이용한 React jurgen-94.tistory.com 1탄에 이어 두번째 글!! 현 프로젝트에서 Intersection Observer를 사용하여 무한스크롤을 구현한 곳은 총 세 곳인데 우선은 공지사항을 받아오는 것부터 해보자! Intersection Observer의 동작원리에 대해서는 1탄에서 설명했고 실제로..

프로젝트 내에서 무한스크롤을 구현하기 위해 Intersection Observer API를 사용했으며 여러 곳에서 재사용하기 위해 커스텀훅으로 만들어 놓았다. 동작원리를 간단하게 설명하면 먼저 observer(관찰자)를 생성해준다 사용자가 브라우저에서 스크롤을 내려 observer가 타겟을 보게끔 해주면 추가적인 데이터를 받아와 화면에 렌더링 하는방식이다. 현재 프로젝트에서 Intersection Observer를 세개의 컴포넌트에서 사용하고 있기 때문에 커스텀 훅으로 만들었으며 그 훅을 먼저 설명하겠다. import { useEffect, useRef } from 'react'; export default function useObserver(options) { const { fetcher, depen..