[유튜브 클론코딩] 2.9 MVC Pattern - Part. 1

2021. 2. 16. 18:22Projects/유튜브 클론코딩

728x90
반응형

2.9 MVC Pattern - Part. 1

MVC 패턴

지금까지 미들웨어,라우팅에 대해서 알아봤고 이제 MVC를 알아볼 것이다.

- MVC: Model, View, Control을 의미한다.

  • Model: 데이터
  • View: 데이터가 어떻게 생겼는지
  • Controller: 데이터를 보여주는 함수(데이터를 찾는 함수)
    • MVC는 패턴이다. 패턴은 일종의 끝내주는 구조 같은 것

 

userRouter.js , videoRouter.js 만들기(URL과 함수를 분리하기 위해)

 

1.  app.js에서 이 주석 처리한 부분들을 삭제한다.↑(왜냐하면 라우터로 만들어줄 거기 때문에)

2. router.js -> userRouter.js로 이름을 변경하고(뭐 무슨 import창뜨는데 ok함)

3. videoRouter.js도 파일을 만들어준다.

4. 이 router파일들을 routers라는 폴더를 만들어서 안에 넣어둔다.

 

 

import express from "express";

const userRouter = express.Router();

export default userRouter;

userRouter.js ↑

import express from "express";

const videoRouter = express.Router();

export default videoRouter;

videoRouter.js ↑

이렇게 작성해준다.

 

import userRouter from "./routers/userRouter";

import videoRouter from "./routers/videoRouter";



app.use("/user", userRouter);

app.use("/video",videoRouter);

app.js에서 이것을 손본다.(import)

 

 

 

글로벌 라우터 만들기(globalRouter.js)

뿐만 아니라 글로벌 router도 가질 것이다.(전역 라우터)

전역 라우터(글로벌 라우터)는 예를 들면 /join, /login, /home 이런 것을 다룬다.

import express from "express";

const globalRouter = express.Router();

export default globalRouter;

globalRouter.js 파일을 만든다. (그냥 다른 라우터 파일 복사해서 그냥 이름만 바꿔줌.)

import globalRouter from "./routers/globalRouter";



app.use("/", globalRouter);

app.js에서는 다음과 같은 코드를 추가한다.

당연히 import해주고, app.use로 사용하도록 함 (이제 이거 많이 해봤음)

( 누군가 root("/")로 접속하면 globalRouter가 찾아질 것이라는 말임)

 

 

 

 

 

 

 

 

 

728x90
반응형