HomeAboutMeBlogGuest
© 2025 Sejin Cha. All rights reserved.
Built with Next.js, deployed on Vercel
🐣
프론트엔드 데브코스 3기 교육생
/
🙂
동근팀
/
2023/01/23(월)
2023/01/23(월)
2023/01/23(월)

2023/01/23(월)

팀원
회의
Jan 23, 2023
프로젝트
프로젝트 종료 후 DAY-18

오늘의 할 일


무한스크롤 구현하기


  • 구글링을 통해서 무한스크롤 방법을 찾아서 팀원들이 함께 화면공유를 하며 진행
  • 처음 호출할 때 중복된 값이 3번 들어오는 문제
→ 리액트 스트릭 모드를 꺼서 2번으로 줄임
→ 처음에 intersecting 값이 왜 true로 변했다가 false가 되는가??
→ 두번 중복 호출될 때 api를 다음 데이터로 바로 받아오게 하면 되지 않을까?
axios.get에서 then으로 묶어서 setPageLimitnumber 를 더한다.
axios.get (`...`).then((res) => setPageLimitNumber((prev) => prev + 1))
하지만 중복 호출될 때 page의limit 값이 더해지지 않았음.

<해결>
useState의 의존성배열에 들어가는 값을 변경 (맞나?)
api 호출의 offset과 limit가 의미하는 게 무엇인지 다시한 번 확인…^^
 

미디어 쿼리 적용하기


각 페이지 별 미디어 쿼리 적용 해보자!!
모바일 버전의 경우 채널 목록을 제거하고 하단 footer에 bar를 만들어 이동하는 식으로 구현
검색 페이지를 별도로 구현
 

다크 모드 색상 정리


다크 모드 색상을 대략적으로 선택