nextjs
-
You're importing a component that needs useEffect. It only works in a Client Component but none of its parents are marked with "use client", so they're Server Components by default.nextjs 2024. 6. 19. 16:32
You're importing a component that needs useEffect. It only works in a Client Component but none of its parents are marked with "use client", so they're Server Components by default. 서버 컴포넌트에서 useEffect 사용 시도:서버 컴포넌트에서는 useEffect와 같은 클라이언트 사이드 훅을 사용할 수 없습니다.따라서 서버 컴포넌트에서 useEffect를 호출하려고 하면 에러가 발생할 수 있습니다. useClient 호출이 필요한 부모 컴포넌트 없음:Next.js에서는 특정 컴포넌트가 클라이언트 컴포넌트로 동작하도록 만들기 위해부모 컴포넌트에 useClient..
-
서버 컴포넌트 와 클라이언트 컴포넌트nextjs 2024. 6. 19. 16:29
서버 컴포넌트 (Server Components)렌더링 위치: 서버에서 렌더링 데이터 페칭: 서버에서 직접 데이터베이스 또는 API와 상호작용하여 데이터를 가져올 수 있습니다.( 데이터 페칭(Data Fetching)은 애플리케이션이 외부 소스로부터 데이터를 가져오는 과정을 의미 ) 목적: 초기 페이지 로드 속도를 높이고 서버 컴포넌트를 사용하면 초기 페이지 로드 속도를 높일 수 있습니다.이는 서버에서 HTML을 미리 생성하여 클라이언트로 전송하기 때문에 SEO 친화적이며서버에서 렌더링된 HTML을 검색 엔진( 검색 엔진 최적화(SEO)에 유리 )봇이 쉽게 읽을 수 있기 때문입니다. 클라이언트 측에서 모든 것을 렌더링하는 경우,검색 엔진 봇이 자바스크립트를 실행하지 못해 콘텐츠를 제대로 인덱싱하지 못..