서버 아키텍쳐 구축하기

아키텍처 패턴은 레이어 패턴, 클라이언트 서버 패턴, 파이프 필터 패턴 등 여러가지가 있는데

이번 강의에서는 Model View Controller 패턴을 서버에 응용해서 적용했다

 

Model = Data, View = Route, Controller는 그대로 Controller로 응용하여 적용했다.

먼저 Model 부분이다

 

let tweets = [
  {
    id: 1,
    username: "bob",
    name: "Bob",
    text: "hello",
    createTime: "2023-01-01 13:11:10",
  },
  {
    id: 2,
    username: "jack",
    name: "Jack",
    text: "hey~! nice to meet you!",
    createTime: "2023-01-01 13:11:10",
  },
];

export function allTweet() {
  return tweets;
}

export function tweetByUsername(username) {
  return tweets.filter((tweet) => tweet.username === username);
}

export function tweetById(id) {
  return tweets.find((tweet) => tweet.id === id);
}

export function addTweet(tweet) {
  tweets = [tweet, ...tweets];
}

export function modifyTweet(id, text) {
  const tweet = tweetById(id);
  tweet.text = text;
  return tweet;
}

export function removeTweet(id) {
  tweets = tweets.filter((tweet) => tweet.id !== id);
}

메모리상에 Tweet을 가지고 있고 동작에 따른 트윗을 적절하게 처리하여 return한다

 

다음은 컨트롤러이다

import {
  allTweet,
  modifyTweet,
  removeTweet,
  tweetById,
  tweetByUsername,
} from "../data/data";

export function getTweet(req, res, next) {
  const username = req.query.username;
  const data = username ? tweetByUsername(username) : allTweet();

  res.status(200).json(data);
}

export function getTweetById(req, res, next) {
  const id = req.params.id;
  const data = tweetById(id);
  if (data) {
    res.status(200).json(data);
  } else {
    res.status(404).json({ message: `Sorry tweet id : ${id} is not defined` });
  }
}

export function postTweet(req, res, next) {
  const { name, username, text } = req.body;
  const tweet = {
    id: Date.now().toString(),
    username,
    text,
    name,
    createAt: new Date().toString(),
  };
  addTweet(tweet);
  res.status(201).json(tweet);
}

export function updateTweet(req, res, next) {
  const id = req.params.id;
  const text = req.body.text;
  const tweet = tweetById(id);
  if (tweet) {
    tweet = modifyTweet(id, text);
    res.status(200).json(tweet);
  } else {
    res.status(404).json({ message: `Sorry tweet id : ${id} is not defined` });
  }

  res.status(204).json(tweet);
}

export function deleteTweet(req, res, next) {
  const id = req.params.id;
  removeTweet(id);
  res.status(204);
}

req에서 들어온 파람이나 쿼리 등을 적절하게 받아서 데이터 쪽에 알맞게 요청하고 있다.

 

마지막으로 라우트쪽이다

import express from "express";
import {
  deleteTweet,
  getTweet,
  getTweetById,
  postTweet,
  updateTweet,
} from "../controller/tweetController";
const router = express.Router();

router.get("/", getTweet);

router.get("/:id", getTweetById);

router.post("/", postTweet);

router.put("/:id", updateTweet);

router.delete("/id", deleteTweet);

export default router;

MVC패턴으로 나누면서 가장 보기 편해진 곳이 바로 이 Route쪽이라고 생각한다

보기도 편해졌고 무슨 기능을 하는지 알기도 쉬워졌다.. 내가 작성한 코드와

강의에서 어떤 방식으로 리팩토링했는지 비교해봐야겠다

 

내가 구성한 코드와 크게 다른건 없다

다만 명명을 Repository와 Controller를 사용한 점과 함수 이름이 조금 더 간결하다는 점?

이게 크게 다른건가?..;;ㅎㅎ 아무튼 내가 리팩토링을 잘 했다는 점이 뿌듯했다 

코드를 수정하고 나서 Postman에서도 제대로 동작했으니 기능엔 이상이 없는걸로!