본문 바로가기
리액트 공부와 함께 하는 일상/2주차

[TIL] Next.js - Routing

by fefe94 2022. 1. 14.

라우팅이란?

간단히 말해서 '페이지 이동' 하는 것을 말합니다.

 

라우팅

라우팅 IT용어사전

망에서, 각 메시지에서 목적지까지 갈 수 있는 여러 경로 중 한 가지 경로를 설정해 주는 과정.

[네이버 지식백과] 라우팅 [routing, 經路定-] (IT용어사전, 한국정보통신기술협회)

 


 

Next.js에서 라우팅 사용하기!

useRouter()push해서 페이지 이동을 할 수 있습니다.

const router = useRouter()

라우터를 만들어 준뒤

router.push("이동할 페이지")

push 안에 이동할 페이지 경로를 넣어주면 됩니다.

 

 

 


라우팅 종류

정적라우팅

관리자(인간)가 경로를 선택해야 하는 것.

 

정적 라우팅으로 코딩하면 

http://localhost:3000/05-04-static-routed-board/1

 

위와 같은 링크 하나 당 아래와 같은 폴더를 하나 씩 만들어야 합니다.

만약 페이지 수가 100개가 넘는다면..

그만큼 폴더를 만들어줘야 합니다.

 

동적라우팅

라우터가 동적으로 경로를 선택하는 것.

사진처럼 폴더명을 []대괄호로 감싸서 하위폴더를 만들어주면

동적 라우팅을 해줄 수 있습니다.

http://localhost:3000/05-04-static-routed-board/1 -> 이 주소에서의 1을

http://localhost:3000/05-04-static-routed-board/[vvv] -> [vvv]로 받아서 표현할 수 있습니다.

 

 

 

 

 

 

 

 

 

 

댓글