유뷰트 클로닝 #3 Router : Introduction

Preview

https://expressjs.com/ko/4x/api.html#router
router.all()
router.METHOD()
router.param()
router.route()
router.use()

모든 Express 애플리케이션에는 앱 라우터가 내장되어 있습니다.
라우터는 미들웨어 자체처럼 작동하므로 app.use()에 대한 인수로 또는 다른 라우터의 use() 메서드에 대한 인수로 사용할 수 있습니다.
최상위 익스프레스 객체에는 새로운 라우터 객체를 생성하는 Router() 메서드가 있습니다.

강의 정리

What Is Router?

Router 는 작업중인 주제를 기반으로 url 을 그룹화 해준다.

/ -> Home              
/join -> Join
/login -> Login
/search -> Search                     // 위 4개와 같은 라우터를 "글로벌 라우터" 라고 한다.

/users/edit -> Edit user
/users/delete -> Delete user

/videos/watch -> Watch Video 
/videos/edit -> Edit Video 
/videos/delete -> Delete Video 
/videos/comment -> Comment on a video
/videos/comments/delete -> Delete A Comment of a Video.

Router 로 3개의 url 그룹으로 정리했다: 글로벌, users, videos

항상 이렇게 "논리적으로" url 을 정리하진 않는다.
ex_ nomadcoder.co/coures/wetube 가 더 논리적이지만 nomadcoder.co/wetube 가 더 간단하고 마케팅적으로 들린다. 이런 예외를 두기도 한다.

How to Create Router

부모 라우터: 큰 가닥 잡기

const Router1 = express.Router(); // Router 1 생성
const Router2 = express.Router(); // Router 2 생성
const Router3 = express.Router(); // Router 3 생성

app.use("/fruit", Router1); // Router 1 에 url 할당
app.use("/vege", Router2); // Router 2 에 url 할당
app.use("/seafood", Router3); // Router 3 에 url 할당

자식 라우터: 세부 가닥들 정리하기

function handlePage1 (res,req) => res.send("We are handling 1 here.";
Router1.get("/apple", handlePage1); 
// Router1.get("apple") 은 "http://주소/fruit/apple"에서 브라우저가 화면에 띄우는 함수를 표시한다.

의문점

x

느낀점

• 라우터란, 한 웹사이트의 url 들을 여러개의 전선들이라고 생각한다면, 맨 처음에 가장 큰 케이블 타이로 몇 가닥 나눠주고, 거기서 또 작은 케이블 타이들로 세부적으로 나눠주는 역할을 한다는 느낌을 받았다. 케이블 타이 같은 존재. 더 깔끔한 정리를 위한 것.

요약

• express 에 내장되어있는 router 객체를 통해 사이트의 url 을 깔끔히 정리하는 법에 대해 배워보았다.
• 생성: express.Router(),
  할당: app.use("세부url", 라우터명)
• 그 외 routers 와 각 router 의 controllers 를 리팩토링하여 정리하고 export default 와 export 의 차이점에 대해서도 강의에서 언급되었으나, 이미 알고 있던 내용이므로 정리는 따로 x