[ Next.js14 ] 05. 정적 Metadata set

sohyun·2024년 2월 5일
0

Next.js14

목록 보기
5/9
post-thumbnail

route group(logical group) : (폴더이름) url을 바꾸지 않고 그룹핑 해줌
단 rootlayout과 non-found 파일은 app 폴더에 있어야함

metadata

메타데이터도 중첩이 가능하지만 실제로는 병합이됨 마치 동일한 인터페이스명을 작성하면 자동 병합되는것과 비슷

특징

  1. 페이지나 레이아웃만 메타데이터를 내보낼수잇음 !!
  2. 컴포넌트에는 내보낼수없으며,서버컴포넌트에서만 가능함
  3. 선언적으로 쓰임 이유는 metadata라는 것을 꼭 선언해야하며,
  4. 어떠한 컴포넌트도 라이브러리도 가져와서 참조하지 않고 객체를 내보내기만 하면됨.
  5. 메타데이터에 많은 필드가 있고 동적 메타데이터 set도 가능함 !
  6. 메타데이터에 대한 템플릿을 만들 수 있음
// layout.tsx (root)

export const metadata: Metadata = {
  title: {
    //템플릿 %s 원하는 문자열이 들어감
    template: "%s | Next.js",
    //default 안정해주면 error남
    default: "Loading...",
  },
  description: "Generated by Next.js",![]

};

만약 없는 경로로 가게되면 default에 정해둔 텍스트가 나오는것을 확인할 수 있다.

profile
냠소현 개발일지

0개의 댓글