Official Docs

공식 문서 확인 기준

Next.js 공식 문서는 기능별로 분리되어 있지만 실제 앱에서는 route, rendering, cache, deployment가 연결된다. 예제 코드를 현재 segment 조건에 맞춰 읽어야 한다.

01

현재 문맥을 먼저 적는다

server component인지 client component인지, route handler인지 server action인지 구분한다.

02

캐시 조건 확인

fetch 예제는 cache, revalidate, dynamic 설정에 따라 전혀 다른 운영 결과를 만든다.

03

프로젝트에 맞게 축소 적용한다

문서 예제를 통째로 붙이지 말고 현재 route에서 필요한 한 기능만 최소 코드로 검증한다.

File convention
파일 이름이 API page, layout, route, loading, error 파일 규칙은 위치와 함께 읽어야 한다.
이름만 외우면 범위를 놓친다.
Rendering
정적/동적 조건 어떤 API를 쓰면 dynamic rendering으로 바뀌는지 확인한다.
성능과 캐시에 영향이 있다.
Caching
데이터 신선도 fetch cache, revalidate, tag, path invalidation을 연결해 본다.
운영 요구와 맞춘다.
Deploy
런타임 차이 Node runtime과 Edge runtime에서 가능한 API가 다를 수 있다.
배포 환경을 확인한다.

문맥 · 캐시 · 빌드 점검

문맥 예제 코드가 server/client 어느 쪽에서 실행되는지 확인했는가.
캐시 공식 예제의 기본 캐시 동작이 내 데이터 신선도 요구와 맞는가.
빌드 문서대로 적용한 뒤 production build에서 같은 동작을 확인했는가.

문서 적용

// docs example -> current runtime -> cache policy -> minimal route test -> build