노마드코더 유튜브 클론 챌린지 5일차 TIL

---

🔍Router

컨트롤러와 URL을 관리하기 쉽게 해주는 역할
사용할 데이터를 고려해서 어떠한 URL을 사용할지 계획한 후 도메인 별로 라우터를 나누면 관리하기 쉽다

---

📌Router 사용하기

server.js (일부 생략)

import express from "express";
import router from "./routers/router";

const app = express();
app.use("/", router);

router.js에서 default로 export한 라우터를 import해준다.
이때 라우터의 실제 이름인 router가 아닌 어떤 이름으로든 import가 가능하다.

app이 "/"주소에 접근하면 router를 호출한다.

router.js

import express from "express";
import { home } from "../controllers/controller";

const router = express.router();
router.get("/", home);
export default router;

server.js에서 라우터를 사용하기 위해 라우터를 export해준다.
default방식의 export는 파일 당 한번만 가능하다.

controller.js에서 export const로 선언한 컨트롤러 home을 import해준다.
이때 컨트롤러의 실제 이름을 지켜서 중괄호{} 안에 작성해줘야 한다.

controller.js

export const home = (req, res) => res.send("HOME");

router.js에서 컨트롤러를 호출하기 위해 컨트롤러를 export해준다.
export const는 개수 제한이 없다.

---

✅ 라우터와 컨트롤러는 파일이 여러개 생기면 라우터 폴더, 컨트롤러 폴더에 따로 담아서 보관하자!
✅ URL에 파라미터가 들어가는 경우, use(or get 등등)을 작성하는 순서에 주의를 기울여야한다.

router.get("/:id", see);
router.get("/remove", remove);

router.get("/remove", remove);
router.get("/:id", see);

http://localhost:4000/remove 에 접근했을 때,
첫 번째 경우는 remove를 파라미터로 인식해 see 컨트롤러가 호출되고,
두 번째 경우는 첫 줄의 코드가 먼저 인식되므로 remove 컨트롤러가 알맞게 호출된다.

파라미터에 제한을 둔다면(숫자만 등등) 코드 순서에 결과가 좌우되지 않게 할 수도 있다.

---

라우터 이름만 알고 그래서 정확하게 뭐야..?라고 하면 몰랐는데...😅
이렇게 만나니까 반갑고 제대로 알게되어서 넘 좋다.

강의부터, 과제까지 모두 라우터 사용하는 연습을 많이 시켜주셔서 짱짱

전에는 프로젝트를 하나 만들 때 파일을 나누는 기준, 폴더를 나누는 기준을 잘 모르겠어서 볼 때마다 궁금했는데 직접 써보면서 하니까 왜 나누는지 더 잘 이해된다.

벌써 유튭 클론이 5일차라니
완전 무지한 부분들을 배우다보니 바닐라JS 크롬앱 클론 챌린지할 때 보다 훨씬 머리도 더 써야하고, 시간도 많이 드는 것 같다.
살짝 정신 놓으면 멀리 가 있을 거 같으니 정신줄 잡아야지😅
글고 TIL 제발 놓지말자