2022년 3월 1일
Next.js에서 자주 쓰는 TypeScript 문법 정리
nextjstypescriptapp-routerpatterns
Next.js App Router 기준으로 props, params/searchParams, Metadata, app/api route handler, 공용 도메인 타입, 제네릭 fetch 헬퍼 등 실무에서 자주 쓰는 TypeScript 패턴을 정리한 글입니다.
1HTML 속성을 확장하는 컴포넌트 props 타입 패턴을 예제로 보여 준다
2동적 라우트와 캐치올 라우트에서 params/searchParams 타입을 어떻게 잡을지 설명한다
3Metadata와 route handler 응답 타입을 명시해 서버/클라이언트 타입을 맞추는 방법을 다룬다
4types/ 폴더에 도메인 타입을 모아두는 구조를 제안한다
5fetchJson<T>() 같은 작은 제네릭 헬퍼로 데이터 fetching을 타입 안전하게 만드는 방법을 설명한다