Next 13 버전 use client

miin·2024년 4월 9일
0

Next.js

목록 보기
11/11

use client

  • Next 13 에서는 기본적으로 모든 컴포넌트들이 서버 컴포넌트가 되었다. 즉 서버에서 렌더링과 API 호출 등이 이미 이루어지는 것이다
  • 클라이언트 사이드에서의 로직들을 수행하기 위해서는 컴포넌트의 최상단에use client를 사용하는것이 강제시 되었다
  • use clent가 선언된 파일 내의 모든 모듈, 자식 컴포넌트까지 모두 클라이언트 번들로 취급된다

styled-components 사용시

styled-components를 사용하려면 최상단에서 root를 감싸줘야하고 그러려면 클라이언트에서 로직이 작성되어야 한다.
하지만 layout.tsx에 use client를 작성시 에러가 난다
이를 해결하기 위해 StyledComponentsRegistry 컴포넌트를 따로 만들고 해당 컴포넌트를 layout.tsx에 끼워넣는 방식으로 사용 하면 된다.

공식문서

0개의 댓글