파일기반 라우팅과 서버 컴포넌트의 이해
- app 폴더 안에있는 page.js 파일은 서버 컴포넌트임
- node 실행 환경에서는 콘솔을 찍으면 보이는데 개발자도구를 키면 콘솔이 안찍힘
- 겉보기엔 일반적인 컴포넌트지만 Next에서 특별 대우 받는 것..
파일 시스템을 통한 추가 경로 설정
리액트에선 리액트 라우터가 필요했지만 next는 폴더만 추가해주면 됌
1. app 폴더안의 만들고싶은 페이지의 폴더를 만들어준다 ( 이때 폴더명이 경로임 )
2. 생성한 폴더 안의 page.js 파일을 생성해준다
보호된 파일명
이 파일명들은 app/폴더(부 폴더 포함) 내부에서 생성될 때만 보호된다. app/폴더 외부에서 생성될 경우 이 파일명들을 특별한 방식으로 처리하지 않음.음.
- page.js => 신규 페이지 생성 (예: app/about/page.js은 /about page을 생성)
-
layout.js => 형제 및 중첩 페이지를 감싸는 신규 레이아웃 생성
-
not-found.js => ‘Not Found’ 오류에 대한 폴백 페이지(형제 또는 중첩 페이지 또는 레이아웃에서 전달된)
-
error.js => 기타 오류에 대한 폴백 페이지(형제 또는 중첩 페이지 또는 레이아웃에서 전달된)
-
loading.js => 형제 또는 중첩 페이지(또는 레이아웃)가 데이터를 가져오는 동안 표시되는 폴백 페이지
-
route.js => API 경로 생성(즉, JSX 코드가 아닌 데이터를 반환하는 페이지, 예: JSON 형식)
동적 경로 설정
이미지 파일 불러오기
- .src
- Image 컴포넌트 사용하기
