Metadata

metadata가 뭐임?

꼭 내보내야 하는 object를 말하고 메타데이터라고 불린다. layout페이지가 자동생성되었을때 페이지 안에 메타데이터도 같이 생성되는게 확인가능하다. 홈페이지가 열렸을때 url윗쪽에 있는 타이틀을 지칭한다.

export const metadata = {
  title: "Next| Next movies",
  description: "The best mobies on the best framework",
};

만약에 메인페이지에서만 title & description을 보여주고싶으면 메인페이지에 metadata를 넣어주면된다.
물론 다른페이지에 title을 변경하고싶으면 다른페이지에서도 메타데이터를 지정해주면된다.
여기서드는 의문은 전체 layout페이지에 넣으면 어케될까? layout은 상위->하위에 중첩되서 적용되잖씀? 그럼 타이틀도 개많아지는거 아님? ㄴㄴ 아님. matadata의 원리는 중첩되는게 아니라 병합되기 때문임. 그래서 하위에 지정된 메타데이터가 파일기준 더 가깝게 위치하고 있기때문에 먼저 적용되고, layout의 메타데이터는 병합되서 사라지게되는거임. 또 다른 규칙이 있다면, 페이지나 레이아웃을 통해서만 메타데이터를 내보낼 수 있다. 또 메타데이터는 항상 server component에 위치해야한다.

중복되는 메타데이터가 있다면 템플릿으로 만들어서 사용할 수 있다.

export const metadata = {
  title: {
  	template: "%s | Next Movies",
    default: "Loading..."
  }, // tilte은 객체로도 사용가능하다.
  description: "The best mobies on the best framework",
};

layout페이지에 템플릿을 지정해주면, 각 페이지에 적용된 타이틀이 "%s" 안으로 들어가 적용되며, 페이지에 적용된 타이틀이 없다면, default값인 Loading이 전체 타이틀에 적용된다.

route group이 뭐지?

Next js 공식웹 답변 :Organizing routes into groups.

route group의 규칙 : 폴더 이름을 괄호로 묶어줘야한다. 폴더 이름을 괄호로 묶어주면 url을 바꾸거나 하지 않는다. 괄호에 묶겨있지 않은 폴더는 url을 생성하죠? ㅇㅇ

route group을 만들면 편리한점이 routes를 그룹화시켜서 logical groups로 만들 수 있기 때문이다. 뭐 예를들면 (movies)라는 폴더를 만들면, 거기따 moive에 관련된 배우이름, 영화정보, 뭐 여러가지를 카테고리로 나눠서 넣을 수 있어서 깔끔해지고 알아보기도 편리하다.