Next.js 심화

Dev_Sumni·2022년 5월 25일
post-thumbnail

Pages → Pre-rendering/ Dynamic routes 통해 사용할 경우 Paths까지 사용
getStaticProps → revalidate(ISR)/ redirect/ notFound
getStaticPaths → fallback: 'blocking'
getServerSideProps → req.cookies직접 다룰수 있다.

  • Layouts는 여러 Layout, 여러 Page에서 공통된 화면을 그려줄때 사용, Page마다 특정하게 바꾸고 싶을때는 Page.getLayout 활용 가능

  • ESLint: JS code에서 문제가 될 부분을 찾고 고칠 수 있는 도구

Layouts → Page.getLayout
Optimization → Image/ Font/ Script
Static file/ Fast Refresh → public/ 똑똑하게 reload 판단
기타 → ESLint/ Typescript/ 환경 변수

  • API Routes
    pages/api/*는 페이지가 아닌 api처럼 동작한다.
    client side 코드에는 추가되지 않는다.

Next.js의 라우팅 → pages 폴더의 file system 활용
Dynamic Routes → 한 단계 [slug]/ 여러 단계 [...slug]/ 없는 단계까지 [[...slug]]
Router → 직접 라우터를 조작 가능 push/ shallow
API Routes → API 서버로의 동작 middlewares

profile
개발 일지 끄적 끄적,,

0개의 댓글