[Node.js] MVC 패턴

MVC 패턴

소프트웨어 개발에서 사용되는 디자인 패턴 중 하나이다.

세 가지 주요부분으로 분리하는데,

1. 모델
   -> 데이터와 데이터를 처리하는 비즈니스 로직을 담당
   -> 데이터베이스, 파일, 외부 서비스 등의 데이터 소스와 상호작용한다.

2. 뷰
   -> 사용자 인터페이스(UI)를 담당
   -> 모델에서 가져온 데이터를 시각적으로 표현

3. 컨트롤러
   -> 모델과 뷰 사이의 상호작용을 조정하고 제어
   -> 사용자의 입력 처리, 해당요청에 대한 적절한 모델 동작을 수행 후, 변경된 데이터를 뷰에 업데이트하여 표시한다

실습

우리가 적었던 server.js에서 옮겨줄 것이다!

models, controllers, views 폴더를 각각 만들어준다.

controllers에 우리가 적었던 것들을 하나하나 옮겨줄 것인데,

• 원래 코드

  app.get("/users", (req, res) => {
   res.send(Users);
  });

• 수정 코드
  server.js에는 이정도만 남기고,

  app.get("/users", );

  users.controller.js 파일에 getUsers라는 함수를 만들어 이렇게 정의줄 것이다.

  function getUsers(req, res) {
   res.json(users);
  }

  그리고 만든 함수를 가져와서 다시 server.js에 적용해주면 끝!

  app.get("/users", getUsers);

usermodel.js에도 모델을 하나 만들어준다.

const Users = [
  {
    id: 0,
    name: "chaeyeon",
  },
];

module.exports = {
  users: Users,
};

불러올 때는 아래와 같이 불러와 사용!

const { users } = require("../models/users.model");

전체 소스코드

server.js

// express 모듈 불러오기
const express = require("express");
const {
  getUsers,
  getUser,
  postUser,
} = require("./controllers/users.controller");

// 포트, 호스트 지정(호스트는 안 해줘도 됨)
const PORT = 8080;
const HOST = "0.0.0.0";

const Users = [
  {
    id: 1,
    name: "chaeyeon",
  },
  {
    id: 2,
    name: "sihyeon",
  },
  {
    id: 3,
    name: "suyeon",
  },
];

// 새로운 Express 어플 생성
const app = express();
app.use(express.json());

app.use((req, res, next) => {
  console.log(`${req.method} ${req.url}`);

  next();
});

app.get("/users", getUsers);

app.post("/users", postUser);

app.get("/users/:userId", getUser);

// / <- 경로로 요청이 오면 Hello World를 결과값으로 전달
app.get("/", (req, res) => {
  res.send("Hello World");
});

// 해당 포트와 호스트에서 HTTP 서버 시작
app.listen(PORT, HOST);

console.log(`Running on http://${HOST}: ${PORT}`);

user.controller.js

const { users } = require("../models/users.model");

function getUsers(req, res) {
  res.json(users);
}

function getUser(req, res) {
  const userId = Number(req.params.userId);

  const user = users[userId];

  if (user) {
    res.json(user);
  } else {
    res.sendStatus(404);
  }
}

function postUser(req, res) {
  if (!req.body.name) {
    return res.status(400).json({
      error: "Missing user name",
    });
  }

  const newUser = {
    id: users.length,
    name: req.body.name,
  };

  users.push(newUser);
  res.json(newUser);
}

module.exports = {
  getUsers,
  getUser,
  postUser,
};

users.model.js

const Users = [
  {
    id: 0,
    name: "chaeyeon",
  },
];

module.exports = {
  users: Users,
};