3/18 취준 기록 - 10일차

1. 무한스크롤 기능을 위해 사용한 방식을 설명하세요
   1. react-query에서 제공하는 useInfiniteScroll 훅을 사용하여 무한 스크롤을 구현했습니다. 페이지당 데이터 갯수를 제한하고, Suspense를 활용해 추가 데이터를 로드할 때 로딩 UI를 보여주고 있습니다. Intersection observer를 활용하는 라이브러리를 사용해 특정 엘리먼트가 교차점을 지났을 때 추가 데이터를 로드합니다.
2. 장바구니에 상품을 추가하는 프로세스를 설명해주세요. 상품이 추가될 때 사용자 인터페이스는 어떻게 업데이트되나요?
   1. react-query의 useMutation 훅을 낙관적 업데이트로 처리했습니다. 클라이언트 캐시를 우선적으로 업데이트 하고, 상품 추가 시 요청을 전송하도록 구현했습니다. 먼저 onMutate 메서드에서 선택한 상품 데이터를 캐싱하고 이후 onSuccess 메서드를 이용해 응답 결과를 다시 캐싱합니다. 캐싱을 각각 진행한 이유로 상품 수량을 변경할 때 document id를 이용해 데이터베이스의 상품 수량을 변경하고 있으므로 각각 진행했습니다