Next가 페이징하는 방법(주의: 신기함)

김민석·2021년 5월 20일
0

NodeBird 클론코딩

목록 보기
3/10

page라는 디렉토리를 만들고,
거기에 파일들을 생성하면 알아서 각 엔드포인트를 페이징한다.

심지어 pages/posts/1.js 같은 식으로 만든 것도 알아서 페이징 해줌.

더 나아가서 동적 라우팅도 해준다. 주의 : 신기함

pages/blog/[slug].js → /blog/:slug (/blog/hello-world)

pages/[username]/settings.js → /:username/settings (/foo/settings)

pages/post/[...all].js → /post/* (/post/2020/id/title)

아래는 공식 문서의 예시 코드

import Link from 'next/link'

function Home() {
  return (
    <ul>
      <li>
        <Link href="/">
          <a>Home</a>
        </Link>
      </li>
      <li>
        <Link href="/about">
          <a>About Us</a>
        </Link>
      </li>
      <li>
        <Link href="/blog/hello-world">
          <a>Blog Post</a>
        </Link>
      </li>
    </ul>
  )
}

export default Home

0개의 댓글