Vue.js + Nuxt.js로 동적 URL 페이지 만들기

Nuxt.js는 vue-router를 내장하고 있고, 매우 간편한 방식으로 라우팅을 할 수 있다.

예를 들면 아래와 같은 URL 구조를 Nuxt.js에서 구현하는 방법은 간단하다.

예시 URL 구조

• /article  글 목록
• /article/:id  글 보기
• index  메인페이지
• /user/:name  유저 정보 페이지

Nuxt.js에서 /pages 폴더 구조

• pages/
• article/
• index.vue
• _id.vue
• user/
• _name.vue
• index.vue

폴더 구조만으로도 라우팅이 가능한 Nuxt.js의 장점이다.

더 자세한 내용은 공식문서에 한국어로 잘 나타나 있다. https://ko.nuxtjs.org/guide/routing/