Feat: Week6/nonshaman-m2

[nonshaman]

📚 주차 / 미션

• 6주차 2번째 미션

📌 작업 내용

• useInfiniteQuery로 무한 스크롤 구현하기

✨ 상세 작업 내용

• skeletonUI 구현

✅ 체크리스트

• [o] 기능 정상 작동 확인
• [o] 불필요한 주석 삭제
• [o] 해당 주차 키워드 내용 이해

[yewon20804]

6주차 두번째 미션 확인했습니다 ! useInfiniteQuery + react-intersection-observer로 무한스크롤 잘 구현해주셨고, 스켈레톤 UI도 컴포넌트 분리까지 깔끔하게 작업해주셨네요 👍 아래 코멘트 확인해주세요 !

1. lp.ts — authorld 오타

// week4/mission02/src/types/lp.ts
// 현재
authorld: number;

// 수정
authorId: number;

지금은 개인 프로젝트라 크게 문제는 없지만, 추후 팀 프로젝트나 협업 과정에서는 이런 작은 오타도 타입 사용이나 API 연결 시 이슈로 이어질 수 있어서 수정해두면 좋을 것 같습니다 🙂

---

2. console.log, 주석 삭제

useGetInfiniteLpList.ts 파일에 getNextPageParam 안에 console.log랑
HomePage.tsx에 주석 처리된 코드들은 사용하지 않으면 지워주시는게 좋을 것 같아요 ~!

---

3. HomePage.tsx — 스켈레톤 count

// 현재
{isFetching && <LpCardSkeletonList count={20}/>}

// 수정 제안
{isFetching && <LpCardSkeletonList count={5}/>}

isFetching 상태일 때도 스켈레톤을 20개 고정으로 보여주고 있는데, 실제로 불러오는 limit이 5개이므로 스켈레톤 수를 limit과 맞춰주면 UX가 더 자연스러울 것 같습니다 👍