프론트엔드 서버에서 받아온 HTML 응답을 통해 기본적인 로더와 스켈레톤 UI를 보게 됨

자바스크립트 번들 250-350KB 정도를 다운로드, 이후 실행

API 서버와 커뮤니케이션

프론트엔드 서버에서 받은 사용자 식별 정보로 HTML 응답 전에 API 콜

프론트엔드 서버와 API 서버가 가깝기 때문에 레이턴시가 낮아짐

getInitalProps를 통해 가져옴

data fetching 라이브러리를 사용 -> react-query

useResource 훅을 만들어 사용

아쉬운 점

React Server Components가 이 문제를 해결해주리라 기대하고 계신 듯

예측하려 하지 말고 대응해야 한다

이 분리에는 대부분 기준이 없는 경우가 많다

데이터를 어떻게 다루는지, 어떻게 보여주는 지 예상할 수 없는 코드가 만들어짐

이러한 분리에 적절한 기준을 만들 필요성이 생김

Headless 기반으로 추상화

한 가지 역할만 하기

도메인을 포함하는 컴포넌트와 그렇지 않은 컴포넌트의 분리

인터페이스를 먼저 고민해보기

컴포넌트를 나누는 이유를 생각해보기