Next.js 시작하기 - 기본 다지기 1

HeeGeun.Lee·2022년 9월 27일
0

Next.js 일단 해보기

목록 보기
2/2
post-thumbnail

1. Data Fetching

nextjs의 data fetching 방법 4가지

1-1. SSR (Server Side Render)

서버가 그린다.
그린다: 데이터를 가져와서 그린다.
서버가 그린다: 서버가 데이터를 가져와서 그린다.

사용함수: getServerSide

1-2. CSR (Client Side Render)

클라이언트가 그린다.
그린다: 데이터를 가져와서 그린다.
클라이언트가 그린다: 클라이언트가 데이터를 가져와서 그린다.

사용함수: 따로 없음 (기존 react사용법)

1-3. SSG (Static-Site Generation)

정적인 사이트를 생성한다.
생성한다: 데이터를 가져와서 그려둔다.
정적인 사이트를 생성한다: 정적인 사이트를 데이터를 가져와서 그려둔다.

사용함수: getStaticProps (with getStaticPaths)

1-4. ISR (Incremental Static Regeneration)

증분 정적 사이트를 재생성한다.
재생성한다: (특정 주기로)데이터를 가져와서 다시 그려둔다.
증분 정적 사이트를 재생성한다: (특정 주기로)정적인 사이트를 데이터를 가져와서 다시 그려둔다.

사용함수: getStaticProps (with revalidate)

2. Pages

pages/index.js => /
pages/ssg.js => /ssg
pages/products/[slug].js => /products/*
(js, jsx, ts, tsx)

다음에 계속 👇

profile
느리지만 천천히.

0개의 댓글