
[NextJS] 서버 컴포넌트, 클라이언트 컴포넌트, SSR 차이점
·
🍞 Front-End/Next.js
NextJS에서는 13 버전이 업데이트되면서부터 모든 컴포넌트가 기본적으로 서버 컴포넌트다.서버 컴포넌트와 클라이언트 컴포넌트가 있으며, 이를 잘 이해하고 사용하고 것이 중요할 것 같아 정리하게 되었다. 웹 애플리케이션을 렌더링할 수 있는 환경은 클라리언트와 서버가 있다. 서버 컴포넌트 -> 클라이언트 컴포넌트서버 컴포넌트는 서버에서 실행되는 React 컴포넌트라고 볼 수 있다. NextJS에서는 기본적으로 컴포넌트를 만들 때 서버 컴포넌트로 동작된다. 도입부에 서버 컴포넌트와 클라이언트 컴포넌트의 차이를 설명한 공식문서에서 확인할 수 있듯, 서버 컴포넌트에서는 react lifeCycle을 가능하게 하는 useState, useEffect 같은 함수를 사용하지 못한다. 그렇기 때문에 클라이언트 컴..