Preview

모든 Express 애플리케이션에는 앱 라우터가 내장되어 있다.
https://expressjs.com/ko/4x/api.html#router

좌측에 보이는 메뉴들은 이게 전부이다.
즉, 이게 앱 라우터 기능의 전부이다. (보다시피 별게 없다. 하지만 전부 핵심적이다.)

router.all()
router.METHOD()
router.param()
router.route()
router.use()

일단 라우터가 무엇인지 예시와 함께 한 번 알아보자.

강의 정리

Router 의 개념

Router 는 작업중인 주제를 기반으로 url 을 그룹화 해준다.
개인적으로는 여러 갈래로 이어지는 케이블들을 케이블타이로 엮어주는 느낌으로 이해했다.
그룹별로 좀 더 깔끔하게 나눠주는 역할. 아래 예시를 보자.

예시

// #1 글로벌 라우터 그룹

/ -> Home              
/join -> Join
/login -> Login
/search -> Search                     


// #2 users 라우터 그룹

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


// #3 videos 라우터 그룹

/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 가 더 간단하고 마케팅적으로 들린다. 이런 예외를 두기도 한다.

Router 생성 및 사용 : .Router(), app.use()

부모 라우터: 큰 가닥 잡기

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"에서 브라우저가 화면에 띄우는 함수를 표시한다.

최상위 익스프레스 객체에는 새로운 라우터 객체를 생성하는 Router() 메서드가 있습니다.

라우터는 미들웨어 자체처럼 작동하므로 app.use()에 대한 인수로 또는 다른 라우터의 use() 메서드에 대한 인수로 사용할 수 있다.

요약

• express 에 내장되어있는 router 객체를 통해 사이트의 url 을 깔끔히 정리할 수 있다.
• 생성: express.Router(),
  할당: app.use("세부url", 라우터명)