NUXT 알아보기(3): Routing

routing이란 무엇일까??? routing은 쉽게 생각하면 경로에 페이지를 매칭시키는 것이다.

Nuxt없이 Vue로 개발할 때는 이 routing을 위해서 router 설정 파일(router.js)에 경로와 vue 파일을 하나하나 적어줘야 했다.

하지만 Nuxt와 함께라면 그럴 필요가 없다!!!!!!

---

먼저 pages 폴더 아래에 cool.vue를 만들어보자!!!!

좋았어!!! 이번에는 pages 폴더 밑에 easy 밑에 index.vue 파일을 만들어보자!!!!

완벽하다!!!! yarn dev를 통해 어플리케이션을 실행시켜보자~~~

(참고로 nuxt는 코드를 자동으로 반영해주기때문에 yarn dev 명령어를 이미 실행 중이라면 재실행할 필요가 없다.)

이제 localhost:3000/cool과 localhost:3000/easy로 접속해보면 각각 결과를 볼 수 있다.

cool이라는 경로로 cool.vue가, easy라는 경로로 easy 폴더의 index.vue가 매핑된 것을 볼 수 있다.

이렇게 nuxt는 우리 파일 구조에 맞춰서 자동으로 routing을 해준다.

와우!!!!! 완전 진짜 너무너무 쉽고 멋지다... 앞으로 Nuxt를 애용할 거 같다.