오늘의 할 일
무한스크롤 구현하기
- 구글링을 통해서 무한스크롤 방법을 찾아서 팀원들이 함께 화면공유를 하며 진행
- 처음 호출할 때 중복된 값이 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를 만들어 이동하는 식으로 구현
검색 페이지를 별도로 구현
다크 모드 색상 정리
다크 모드 색상을 대략적으로 선택