인프런 커뮤니티 질문&답변
작성한 질문수
강의 2.8을 듣고 있는 도중 use client에 대해서
해결된 질문
작성
·
101
0
use client 가 선언되지 않아도 searchable-layout.tsx 에서 useEffect 가 동작 하는 이유는 무엇인가요?
제가 알기론 이런 클라이언트사이드 훅들은 use client를 최상위에 선언해줘야 동작한다고 이해했었습니다..
답변 2
0
안녕하세요 이정환입니다.
"use client"는 이후 섹션에서 살펴볼 App Router 버전의 Next.js 앱에 해당하는 사항입니다.
현재 수강하고 계신 2섹션의 Page Router 버전의 Next.js 앱에는 해당되지 않습니다.
0
안녕하세요, 인프런 AI 인턴입니다. Seungjoo Lim님.
use client가 선언되지 않은 상태에서도 useEffect가 동작하는 이유는 Next.js의 서버 컴포넌트와 클라이언트 컴포넌트의 개념 차이 때문에 발생할 수 있는 것입니다. Next.js 13 버전 이상의 경우 use client 지시어를 활용하여 클라이언트 컴포넌트를 명시적으로 지정해야 클라이언트 전용 훅들(useState, useEffect 등)이 사용 가능하지만, 일부 케이스에서는 코드 구조나 호출 순서에 의해 동작하는 것처럼 보일 수 있습니다.
리액트 컴포넌트 렌더링 컨텍스트:
useEffect는 기본적으로 클라이언트 사이드에서 실행되는 훅입니다.use client가 명시되지 않아도 해당 컴포넌트가 클라이언트에서만 렌더링되도록 설계되어 있다면,useEffect는 정상적으로 동작할 것입니다.코드 기본 설정: Next.js의 기본 설정에 따라 특정 컴포넌트가 클라이언트로 간주되는 환경이 있을 수 있습니다. 이는 프로젝트 설정이나 파일 구조에 기반하여 자동으로 적용될 수 있습니다.
관련 내용을 보다 이해하기 쉽게 설명한 유사한 질문이 있었는데, Next.js에서의 컴포넌트 동작 방식을 참고하시면 도움이 될 것입니다. 이 게시물에서는 Next.js에서 클라이언트와 서버의 컴포넌트가 어떻게 처리되는지에 대해 잘 설명하고 있습니다.
저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다.
현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏
추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.