useInfiniteQuery1 리스트 페이지&컴포넌트 설계하기(무한 스크롤) 서버에서 불러온 데이터를 리스트(목록) 형태로 보여주는 페이지는 아주 자주 사용되는 UI 패턴이다. 오늘은 이러한 리스트 페이지와 구성 요소로 사용되는 컴포넌트들을 설계해 보려고 한다. 먼저 수립해둔 컴포넌트 개발 규칙을 다시 꺼내보자. [Action Item] 1. 컴포넌트를 설계할 때 이 컴포넌트가 어떻게 사용되어야 하는지 먼저 정의한다. 2. UI 요소와 데이터 기반 요소를 정리하고 분리하여 각각의 컴포넌트로 구성한다. 3. 컴포넌트의 의도를 정의하고 이를 검증할 수 있는 테스트 케이스를 작성한다. 4. 테스트 케이스를 통과할 수 있는 컴포넌트를 작성한다. 5. 컴포넌트를 리팩터링 하며 정리한다. 한 항목씩 진행해보자! [어떻게 사용되어야 하는가?] 리스트 페이지는 서버에 필요한 데이터를 요청하고 .. 2022. 5. 26. 이전 1 다음
