기억 휘발 방지소

[Node.js] Router 사용하기 본문

Web/Node.js

[Node.js] Router 사용하기

choice91 2021. 9. 15. 00:00
728x90
반응형

Router를 사용하면 요청의 URL을 기반으로 공통되는 라우터들을 그룹화할 수 있다.

/
/join
/login

/users/edit
/users/remove

 

📌 라우터 사용하기

라우터는 express.Router([options])로 사용하면 된다.

이렇게 하면 /users/edit이라는 요청을 보냈을 때 /users를 먼저 찾고 userRouter로 간 후 /edit을 찾게된다.

userRouter에서는 더 이상 /users를 적지 않아도 된다!

 

import express from "express";
import morgan from "morgan";

const PORT = 4000;

const app = express();
const logger = morgan("dev");
app.use(logger);

const globalRouter = express.Router();
const userRouter = express.Router();

const handleHome = (req, res) => {
  return res.send("Home");
};

const handleEditUser = (req, res) => {
  return res.send("Edit User");
};

globalRouter.get("/", handleHome);
userRouter.get("/edit", handleEditUser);

app.use("/", globalRouter);
app.use("/users", userRouter);

const handleListening = () =>
  console.log(`✔ Server listening on http://localhost:${PORT} 💪`);

app.listen(PORT, handleListening);

근데 이렇게 작성하면 규모가 커지고 라우터들이 많아지면 유지보수하기 어려워질 수 있기 때문에 express에서 제공하는 Router API로 라우터들을 분리할 수 있다.

 

📌 라우터 구조 잡기 & 분리하기

폴더구조

src폴더 밑에 controllers와 routes 폴더를 만들었다.

routes폴더 밑에는 globalRouter.js와 userRouter.js를 만든다.

 

분리된 파일들은 export default로 내보낼 수 있고 app.js에서 import 해올 수 있다. (단, export default는 하나만 내보낸다.)

 

globalRouter.js

// globalRouter.js
import express from "express";

const globalRouter = express.Router();

const join = (req, res) => {
  return res.send("Join");
};

const trending = (req, res) => {
  return res.send("Home Page Videos");
};

globalRouter.get("/", trending);
globalRouter.get("/join", join);

export default globalRouter;

userRouter.js

// userRouter.js
import express from "express";

const userRouter = express.Router();

const edit = (req, res) => {
  return res.send("Edit");
};

const remove = (req, res) => {
  return res.send("Delete");
};

userRouter.get("/edit", edit);
userRouter.get("/remove", remove);

export default userRouter;

 

📌 컨트롤러 분리하기

컨트롤러에는 1개 이상의 함수가 있을 수 있다. 컨트롤러를 export default 하게 되면 하나만 export 할 수 밖에 없다.

함수 혹은 변수 앞에 export를 붙여주면 여러 개를 export할 수 있다!

Router에서 import할 때는 Object로 받으면 된다. 단, import 할 때 export 했던 이름 그대로 사용해야한다.

 

globalRouter.js

import express from "express";
// controllers
import { join } from "../controllers/userController";
import { trending } from "../controllers/globalController";

const globalRouter = express.Router();

globalRouter.get("/", trending);
globalRouter.get("/join", join);

export default globalRouter;

 

userRouter.js

import express from "express";
// controller
import { edit, remove } from "../controllers/userController";

const userRouter = express.Router();

userRouter.get("/edit", edit);
userRouter.get("/remove", remove);

export default userRouter;

 

userController.js

export const join = (req, res) => {
  return res.send("Join");
};

export const edit = (req, res) => {
  return res.send("Edit");
};

export const remove = (req, res) => {
  return res.send("Delete");
};

 

globalController.js

export const trending = (req, res) => {
  return res.send("Home");
};
728x90
반응형

'Web > Node.js' 카테고리의 다른 글

[Node.js] express.urlencoded는 뭘까?  (0) 2021.09.16
[Node.js] Pug 설치 및 사용  (0) 2021.09.15
[Node.js] Middleware  (0) 2021.09.14
[Node.js] express.static  (0) 2021.09.09
[Node.js] Express  (0) 2021.09.09