세 줄 요약!1. 클라이언트 컴포넌트인데 인식을 못 하는 것 같은 오류가 뜸2. Recoil 과 Next.js 의 충돌3. Recoil 대신 Zustand 사용 상황평소에 사용했던 것처럼 recoil 라이브러리를 Install 하고 useRecoilState 사용했는데,서버 컴포넌트에서 hook을 사용했을 때 뜨는 오류가 출력됨환경: Next.js 15 + React 19 시도use client 지시자를 빼먹었는가?-> 첫 줄에 잘 넣어 둠 Root Layout에 Provider를 추가하지 않았는가?-> 추가함 결론Recoil 사용을 중단하고 Zustand를 사용함 이유일단 Next.js로 프로젝트를 진행하는 것 자체가 처음이었으므로 아무 생각 없이 install 하고 적용했는데, Next.js의 가장 ..

1. 커스텀 훅 (Custom Hook)React의 Hook을 조합해서 만든 함수 useState, useEffect 같은 기존 hook을 활용해 공통 로직을 재사용할 수 있게 도와준다.단순한 함수처럼 사용되어 JSX를 리턴하지 않는다. 2. HOC (Higher-Order Component, 고차 컴포넌트)컴포넌트를 인자로 받아서 새로운 컴포넌트를 리턴하는 함수 컴포넌트를 감싸서 기능을 추가하는 데 쓰인다.클래스형 컴포넌트에서 주로 사용되었으며, 최근에는 커스텀 훅이 더 많이 사용되는 추세다. 그럼 상황에 따라서 어떤 걸 선택해야 할까?API 데이터 패칭매번 useEffect, fetch 코드를 복사/붙여넣기 하는 건 비효율적이므로 커스텀 훅으로 로직을 분리하는 것이 유리하다. 로딩과 같은 공통 UI..

"use server" : 서버 액션 정의브라우저에서 호출되지만, 서버에서만 실제 실행되는 함수"use server";export async function createReviewAction(_: any, formData: FormData) { // ...} 주의사항・ use server는 반드시 지정된 위치에 선언→ 1. 분리된 파일인 경우 : 반드시 파일 맨 위에→ 2. 컴포넌트 안에 같이 정의된 경우 : 함수 안에서 선언 가능・ use client와 반대 개념으로, 클라이언트에서 트리거는 가능하지만 브라우저에서는 실행 안 됨→ 클라이언트에서는 서버 함수 실행 요청만 가능한 것 revalidatePath() : 페이지 캐시 재검증특정 페이지나 경로에 해당하는 풀 라우트 캐시를 삭제하고 다음 요청 시..