Static Routing, Dynamic Routing

huni_·2022년 7월 1일
0

라우팅에는 두가지 유형이 있습니다.

정적 라우팅(static routing), 동적 라우팅(Dynamic routing)

라우팅이란?

라우팅은 한 네트워크에서 다른 네트워크로 이동시키는 역할을 한다.

정적라우팅과 동적라우팅

정적라우팅

/login 페이지는 누가 언제 접속해도 항상 로그인 페이지가 나옵니다.

이러한 페이지로 이동하는 것을 "정적 라우팅한다"고 합니다.

동적라우팅

반면, 게시판 상세보기와 같은 경우, 글 번호에 따라서 주소가 변경됩니다.

하지만, 이러한 경우에는 게시글이 100개, 1000개가 넘어가게 되면 각각의 글 번호에 따라 페이지를 100개, 1000개씩 만들어 정적라우팅을 해주기는 어렵기 때문에 이러한 라우팅을 효과적으로 처리하기 위해서 동적 라우팅을 사용합니다.
/board/11번 게시글 상세보기 페이지
/board/22번 게시글 상세보기 페이지
/board/33번 게시글 상세보기 페이지
/board/44번 게시글 상세보기 페이지


이러한 페이지로 이동하는 것을 **"동적 라우팅한다"**고 합니다.

next.js에서는 동적 라우팅을 제공해주는데요.

좌측 폴더 구조와 같이 보여주고자 하는 폴더 이름의 하위 폴더로 **[boardId]** 폴더를 만들어 준 후 이 안에 index.js 파일을 만들어주면 동적 라우팅을 사용할 수 있습니다.

대괄호로 감싸준 폴더를 만들어주면 이동해주고자 하는 페이지 번호, 혹은 게시글 번호가 대괄호 안에 쓰여진 변수명에 담겨져 그 변수 안에 있는 데이터를 꺼내 조회할 수 있습니다. (이 때, 대괄호 안에 쓰여지는 폴더 이름은 단순히 변수명이기 때문에 어떻게 작성해주셔도 상관없습니다. ) 이러한 과정을 router 객체가 도와주는 것입니다.

실제로 **router.query = { boardId: 1 }** 이런 형식으로 들어가게 되면서 자동으로 게시글 번호를 꺼내올 수 있습니다.

profile
FrontEnd Developer

0개의 댓글