Server Component와 Client Component 가 뭔 차이인지 알아보기 위해 본 영상에서 중요한 내용을 정리한 글이다.
Server components
서버 컴포넌트로 만드는게 좋은 컴포넌트들의 특징
- 데이터 fetch를 하는 컴포넌트
- DB에 직접 접근하는 컴포넌트
- 민감 정보 (접근 토근이나 API 키 값은거)
- 의존성이 강한 것
Client components
클라이언트 컴포넌트로 만드는게 좋은 컴포넌트들의 특징
- 사용자 상호작용이 많은 것들, 이벤트 리스너가 많은 것
- state와 lifecycle effect를 사용하는 것들
- 브라우저 api만 사용하는 것들
- 커스텀 Hook
- react class 컴포넌트
클라이언트 컴포넌트 만들 때는 서버랑 똑같은데 위에 파일 최상단에 'use client'라고 한 줄 적어줘야 된다. 그리고 useState 같은 것들은 클라이언트 컴포넌트에서만 쓸 수 있다.
요런 특성들을 정리한 사진인데 대충 이거 보면 감이 온다.