Next.js 환경변수 적용 오류 해결: .env.local을 바꿨는데 값이 안 바뀔 때
이 글은 프론트엔드 배포 오류 체크리스트: Vercel, Vite, Expo 문제 해결의 세부 항목입니다. 전체 설정 흐름과 관련 오류 해결 순서는 대표 허브 글에서 함께 확인할 수 있습니다. 환경변수를 수정했는데 화면이나 API 요청에서는 예전 값이 보이면 재시작 문제인지, 접두사 문제인지, 빌드 시점 문제인지 헷갈…
더 읽기Next.js
React 기반의 풀스택 프레임워크 Next.js의 구조와 활용 방법을 정리합니다.
Next.js Route Handler 405 오류 해결: GET/POST 파일 위치와 메서드 설정 확인하기
이 글에서 정리하는 내용 Next.js Route Handler 405 오류는 API 코드가 없어서가 아니라 요청한 HTTP 메서드와 route.ts에서 export한 메서드가 맞지 않을 때 생깁니다. 파일 위치, GET/POST export, 요청 URL, t…
더 읽기
Vercel 404 NOT_FOUND 오류 해결: Next.js 배포 후 라우팅과 rewrites 확인하기
이 글에서 정리하는 내용 Vercel 404 NOT_FOUND는 배포가 실패했다는 뜻만은 아닙니다. 배포는 성공했지만 요청 URL이 Next.js 라우트, rewrites, basePath, 동적 경로, output 설정과 맞지 않을 때도 같은 화면이 나옵…
더 읽기
TanStack Query Hydration 오류 해결: HydrationBoundary와 QueryClient 설정 확인하기
이 글에서 정리하는 내용 TanStack Query Hydration 오류는 서버에서 prefetch한 데이터와 클라이언트 QueryClient가 같은 캐시를 공유하지 못할 때 자주 생깁니다. QueryClient 생성 위치, dehydrate/Hydrat…
더 읽기
Vercel Next.js 배포 실패 해결 체크리스트: 빌드 로그·환경변수·Node 버전 확인법
Vercel Next.js 배포 실패를 가장 빨리 좁히는 순서 Vercel에서 Next.js 배포가 실패할 때는 마지막 실패 문구보다 첫 번째 에러 블록, 환경변수 차이, Node.js 버전, lock 파일, runtime 오류 여부를 순서대로 확인해야 합니다. 이 글…
더 읽기
Next.js useSearchParams Suspense 오류 해결: App Router 빌드가 실패할 때
이 글에서 정리하는 내용 App Router에서 useSearchParams를 쓴 클라이언트 컴포넌트 때문에 production build가 실패하는 상황을 기준으로 원인을 좁히고, 실제 프로젝트에서 어떤 설정과 코드 구조를 확인해야 하는지 정리합니다. 단순 개…
더 읽기
Next.js fetch 캐시 문제 해결: 데이터가 바뀌었는데 화면이 그대로일 때
이 글에서 정리하는 내용 App Router에서 API 데이터는 바뀌었는데 페이지 화면이 오래 그대로 남는 상황을 기준으로 원인을 좁히고, 실제 프로젝트에서 어떤 설정과 코드 구조를 확인해야 하는지 정리합니다. 단순 개념 소개가 아니라 오류가 난 순간 바로 확인…
더 읽기
Next.js Server Actions와 React Hook Form 같이 쓰는 법: form action과 validation 기준
이 글에서 정리하는 내용 Server Actions와 React Hook Form을 같이 쓸 때 클라이언트 검증과 서버 검증 역할이 겹쳐 보이는 상황을 기준으로 원인을 좁히고, 실제 프로젝트에서 어떤 설정과 코드 구조를 확인해야 하는지 정리합니다. 단순 개념 소…
더 읽기
shadcn/ui 설치 오류 해결: components.json과 import alias가 맞지 않을 때
이 글에서 정리하는 내용 shadcn/ui 컴포넌트 생성 후 @ alias와 실제 폴더 구조가 맞지 않아 import가 깨지는 상황을 기준으로 원인을 좁히고, 실제 프로젝트에서 어떤 설정과 코드 구조를 확인해야 하는지 정리합니다. 단순 개념 소개가 아니라 오류가…
더 읽기
Tailwind CSS 클래스 적용 오류 해결: 스타일이 보이지 않을 때 확인할 것
Tailwind 클래스가 안 먹을 때 먼저 확인할 순서 Tailwind CSS 클래스가 적용되지 않는 문제는 대부분 설치 연결, content 경로, 동적 클래스 작성 방식, 설정 변경 후 재시작, CSS 우선순위 중 하나에서 발생합니다. 막연히 코드를 다시 쓰기보…
더 읽기