서버컴포넌트와 클 상세 페이지

먼저 서버 컴포넌트는 말 그대로 서버에서 실행되는 컴포넌트입니다. 서버에서 렌더링이 끝나고 HTML이 완성된 상태로 클라이언트에 전달되죠. 그래서 번들 사이즈가 작아지고 초기 로딩 속도가 빨라지는 장점이 있어요. 또한 데이터베이스나 파일시스템 같은 백엔드 리소스에 직접 접근할 수 있습니다.

반면에 클라이언트 컴포넌트는 우리가 기존에 사용하던 React 컴포넌트와 같다고 보시면 됩니다. 브라우저에서 실행되고, useState나 useEffect 같은 훅들을 사용할 수 있어요. 사용자와의 상호작용도 처리할 수 있죠.

가장 큰 차이점은 서버 컴포넌트는 상태 관리나 이벤트 핸들링을 할 수 없다는 점입니다. 그래서 실제 프로젝트에서는 두 컴포넌트를 적절히 조합해서 사용하게 되는데요, 정적인 데이터 표시는 서버 컴포넌트로, 동적인 상호작용이 필요한 부분은 클라이언트 컴포넌트로 나누어 구현합니다.