티스토리 뷰

NextJS

[NextJS] Dynamic Routes

BIBLIYA 2022. 10. 17. 11:12

react-router-dom에서의 표현 방법

/movies/:id 

 

NextJS에서의 표현 방법

/movies/all

pages/movies/all 파일 만들기

movies만도 만들고 싶을 경우

index도 만들어 준다

 

NextJS는 폴더만 만들어주면 자동으로 만들어준다

 

하지만 ID 값(변수)를 넘길때는 따로 페이지를 만들어 줘야하는 규칙이 있다.

 

[] 대괄호를 사용해서 파일을 만들어 준다.

 

Step 1

import { useRouter } from "next/router";

export default function Detail() {
  const router = useRouter();
  console.log(router);
  return "detail";
}

화면에 보여지는 것

 

'NextJS' 카테고리의 다른 글

[NextJS] catch-all URL  (0) 2022.10.17
[NextJS] Detail Page  (0) 2022.10.17
[NextJS] Server Side Rendering  (0) 2022.10.14
[NextJS] Redirect and Rewrite  (0) 2022.10.14
[NextJS] _app  (0) 2022.10.14
공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
링크
«   2026/04   »
1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30
글 보관함