계속하기 전에 Routing Fundamentals 페이지를 읽는 것을 권장합니다.
이 페이지는 Next.js 애플리케이션에서 라우트를 정의하고 구성하는 방법을 안내합니다.
Next.js는 파일 시스템 기반의 라우터를 사용합니다. 여기서는 폴더가 라우트를 정의하는 데 사용됩니다.
각 폴더는 URL 세그먼트에 매핑되는 라우트 세그먼트를 나타냅니다. 중첩된 라우트를 만들려면 폴더를 서로 중첩시킬 수 있습니다.
page.js
파일은 특정 라우트 세그먼트를 공개적으로 접근 가능하게 만드는 데 사용됩니다.
이 예에서는 /dashboard/analytics URL 경로가 해당하는 page.js 파일이 없어 공개적으로 접근할 수 없습니다. 이 폴더는 컴포넌트, 스타일 시트, 이미지 또는 다른 협력 파일을 저장하는 데 사용될 수 있습니다.
알아두면 좋은 사실: 특별한 파일에는 .js, .jsx 또는 .tsx 파일 확장자를 사용할 수 있습니다.
특별한 파일 규칙은 각 라우트 세그먼트에 대한 UI를 생성하는 데 사용됩니다. 가장 일반적인 것은 각 라우트에 고유한 UI를 표시하는 페이지와 여러 라우트 간에 공유되는 UI를 표시하는 레이아웃입니다.
예를 들어, 첫 번째 페이지를 만들려면 app 디렉토리 내에 page.js 파일을 추가하고 React 컴포넌트를 내보내세요:
export default function Page() {
return <h1>Hello, Next.js!</h1>
}