stay greedy

[Next.js] App Router에서 "use client"란

Next.js 13 이후 App Router 환경에서는 컴포넌트의 기본 동작이 이전과 달라졌다. 핵심은 Server Component가 기본값이라는 점이다. 그래서 "use client"의 의미를 이해하려면 먼저 이 기본 동작을 알아야 한다.App Router 기본 동작: 모든 컴포넌트는 Server ComponentApp Router에서는 별도 선언이 없으면 모든 컴포넌트가 Server Component로 동작한다. Server Component의 특징:서버에서만 실행됨브라우저로 JavaScript 번들이 내려가지 않음서버 렌더링 중심 구조 이 구조 때문에 다음 기능을 사용할 수 없다.useStateuseEffectuseRef이벤트 핸들러 (onClick, onChange 등)window, doc..

Next.js가 삭제된 파일을 계속 참조하는 문제 (.next 캐시 삭제 방법)

프로젝트에서 페이지를 정리하면서 특정 파일을 삭제했는데, 이후 TypeScript typecheck가 계속 실패하는 문제가 발생했다. 에러 메시지를 보니 이미 삭제한 파일을 여전히 참조하고 있었다. 실제 소스에는 해당 파일이 없는데도 빌드나 typecheck에서 계속 문제가 발생했다.원인은 Next.js가 생성하는 타입 캐시와 빌드 아티팩트였다. 특히 .next 디렉토리에 남아 있는 타입 파일이 삭제된 페이지를 계속 참조하고 있었고, tsc가 해당 파일을 참조하려고 시도하면서 문제가 발생했다.문제 원인 - Next.js 빌드 시Next.js는 빌드 과정에서 .next 디렉토리에 빌드 아티팩트, 라우팅 정보, 타입 관련 파일, 캐시 데이터 등 파일들을 생성한다.특히 최근 Next.js에서는 .next/ty..

[Next.js] next-env.d.ts가 자꾸 바뀌는 문제

pre-commit 테스트를 돌리던 중 생긴 문제...^^;apps/store/next-env.d.ts 파일이 자동으로 매번 수정되었다.내가 이 파일을 직접 수정한 적은 없었으나 git에는 변경 사항이 생기고, pre-commit 단계에서 fail했다.결론부터 말하면 이 문제는 Next.js가 next-env.d.ts를 자동으로 재생성하면서 발생한 이슈였다.next-env.d.ts란?next-env.d.ts는 Next.js 프로젝트에서 TypeScript 타입 환경을 설정하기 위해 자동으로 관리되는 파일이다.일반적으로 아래와 같은 내용이 들어 있다./// /// // NOTE: This file should not be edited이 파일은 Next.js가 프로젝트 상태를 보고 자동으로 업데이트하며, 타..