ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • <Node.js> Express (Routes, Controllers, URL parameter)
    액티브 스킬/노드 2021. 11. 7. 23:07
    728x90

    📌 import "[풀스택] 유튜브 클론코딩 (nomadcoders.co)";

     

    &lt; 출처: MDN Web Docs &gt;

    Router

    무엇인가?

    URL을 모듈화하여 정리하는 방법

    어떻게 사용하는가?

    1-1. 라우터 생성

    - const [변수명]videoRouter = express.Router();

    1-2. 라우터 export

    - export default [변수명]videoRouter; (한 파일에서 한번만 가능)

    import express from "express";
    import {watch, edit} from "../controllers/videoController.js";
    
    const videoRouter = express.Router();
    
    videoRouter.get("/:id(\\d+)", watch);
    videoRouter.get("/:id(\\d+)/edit", edit);
    
    export default videoRouter;

    < "videoRouter.js" 소스코드 >

    2-1. 라우터 import

    - import [변수명]videoRouter from "./routers/videoRouter.js"; (변수명 임의로 작성 가능)

    2-2. 라우터의 상위 URL에 라우터 모듈을 로드

    - app.use("/[URL명]videos", [라우터명]videoRouter);

    import express from "express";
    import videoRouter from "./routers/videoRouter.js";
    
    const app = express();
    
    app.use("/videos", videoRouter);

    < "server.js" 소스코드 >

    왜 사용하는가? 

    비슷한 성격의 URL 주소들을 라우터 하나로 묶어서 유지관리에 유리함

     

    Controller

    무엇인가?

    사용자(브라우저)의 요청에 반응하는 역할

    어떻게 사용하는가?

    1. 컨트롤러 정의 및 export

    export const [변수명] = (req, res) => res.send("watch");

    export const watch = (req, res) => res.send("watch");
    export const edit = (req, res) => res.send("edit");

    < "videoController.js" 소스코드 >

    2.1 컨트롤러 import

    import { [변수명] } from "../controllers/videoController.js"; (변수명 변경 불가)

    2.2 라우트의 요청(request)을 받을 컨트롤러 정의

    [라우트명]videoRouter.get("/[URL명]:id(\\d+)", [controller명]watch);

    import express from "express";
    import {watch, edit} from "../controllers/videoController.js";
    
    const videoRouter = express.Router();
    
    videoRouter.get("/:id(\\d+)", watch);
    videoRouter.get("/:id(\\d+)/edit", edit);
    
    export default videoRouter;

    < "videoRouter.js" 소스코드 >

    왜 사용하는가? 

    라우터와 템플릿을 각각 독립적으로 관리할 수 있게 도와줌

     

    URL parameter

    무엇인가?

    URL에 매개변수를 두는 것

    어떻게 사용하는가?

    1. URL 작성

    - "/:[parameter명](\\d+)"

    import express from "express";
    import {watch, edit} from "../controllers/videoController";
    
    const videoRouter = express.Router();
    
    videoRouter.get("/:id(\\d+)", watch);
    videoRouter.get("/:id(\\d+)/edit", edit);
    
    export default videoRouter;

    < "videoRouter.js" 소스코드 >

    2. 파라미터 활용

    - req.params.id

    const { id } = req.params;

    < "videoController.js" 소스코드 >

    왜 사용하는가? 

    라우터의 요청(req)이 그룹화가 가능한 경우, 각각 요청에 대한 URL을 일일이 정의하지 않아도 됨

     

    &lt; 출처: MDN Web Docs &gt;

     

     

    728x90
And bytes to code before I sleep.