도니 House 도니 House

Next.js가 어떻게 돌아가는지 부터 파악해보기 - 프로젝트를 진행하면서 hydration에러가 발생했습니다.React error 418이 Hydration에러가 발생했다라는 뜻이라고 합니다. - 근데 왜 발생했을까요 - 우선 Hydration이 뭔지 부터 저는 바로잡고자 다시한번 공부를 했습니다. Hydration? - 이번 Next.js에서 어떻게 렌더링을 하는지에 대해서 봅시다.- 유저가 브라우저에서 접속 요청을 하면 서버에서 사전 렌더링이 시작됩니다. 이때 Next.js는 서버 컴포넌트(SC)와 클라이언트 컴포넌트(CC)를 구분해서 처리합니다.- 서버 컴포넌트는 서버에서 실행된 뒤 RSC Payload 형태로 직렬화됩니다. 클라이언트 컴포넌트는 서버에서 HTML로 렌더링됩니다. 이 둘을 합쳐 ..