📚 디자인 패턴이란?

디자인 패턴이란 기존 환경 내에서 반복적으로 일어나는 문제들을 어떻게 풀어나갈 것인가에 대한 일종의 솔루션 같은 것입니다.

즉 디자인 패턴은 설계자들이 올바른 설계를 빨리 만들 수 있도록 도와줌.

디자인 패턴이 지켜지지 않은채 개발을 시작하게 되면 후에 유지보수, 가독성, 비효율적인 코드의 문제가 발생할 수 있다.

🟢 MVC 패턴

디자인 패턴 중 하나.

Node.js Express에서는 MVC 패턴을 사용한다.

Moder, View, Controller의 약자로,
하나의 애플리케이션, 프로젝트를 구성할 때 그 구성요소를 세가지의 역할로 구분한 패턴이다.

위 그림에서는 controller와 view가 분리되어 있는데

위 그림과 같이 controller는 view에 영향을 끼친다.

Controller

• 사용자의 요청을 받고 응답을 함
  • 즉, 사용자가 데이터를 클릭하고, 수정하는 것에 대한 "이벤트"들을 처리
• 컨트롤러는 다음과 같은 규칙을 가짐
  1. 모델이나 뷰에 대해서 알고 있어야 한다.
  2. 모델이나 뷰의 변경을 모니터링 해야 한다.

Model

• 데이터를 나타내고, 데이터의 가공이 이뤄짐
• client에 노출되지 않음
• 연산처리, DB 처리가 주 목적
• 모델은 다음과 같은 규칙을 가짐
  1. 사용자가 편집하길 원하는 모든 데이터를 가지고 있어야 한다.
  2. 뷰나 컨트롤러에 대해서 어떤 정보도 알지 말아야 한다.
  3. 변경이 일어나면, 변경 통지에 대한 처리방법을 구현해야만 한다.

View

• 사용자 인터페이스 요소를 나타냄
  • 즉, 데이터 및 객체의 입력, 그리고 보여주는 출력을 담당
• 뷰는 다음과 같은 규칙을 가짐
  1. 모델이 가지고 있는 정보를 따로 저장해서는 안된다.
  2. 모델이나 컨트롤러와 같이 다른 구성요소들을 몰라야 된다.
  3. 변경이 일어나면 변경통지에 대한 처리방법을 구현해야만 한다.

🌲 MVC 패턴을 사용하였을 때의 장점

사용자가 보는 페이지, 데이터처리, 그리고 이 2가지를 중간에서 제어하는 컨트롤, 이 3가지로 구성되는 하나의 애플리케이션을 만들면 각각 맡은바에만 집중을 할 수 있게 됩니다. 공장에서도 하나의 역할들만 담당을 해서 처리를 해서 효율적이게 됩니다. 여기서도 마찬가지입니다.

서로 분리되어 각자의 역할에 집중할 수 있게끔하여 개발을 하고 그렇게 애플리케이션을 만든다면, 유지보수성, 애플리케이션의 확장성, 그리고 유연성이 증가하고, 중복코딩이라는 문제점 또한 사라지게 되는 것입니다. 그러기 위한 MVC패턴입니다.

즉 다음과 같은 장점이 있는 것이다.

1. 모듈화를 통해 각각의 layer가 하는 역할이 명확

   • 이는 각각의 역할에만 집중할 수 있도록 유도. $\rightarrow$ 효율적인 업무
   • 각각의 역할이 명확하므로 문제 발생시 요인 지점을 빠르게 확인 가능

2. 정해진 protocol이 있다면 각 layer는 독자적으로 개발이 가능

   • 협업 및 유지보수, 확장성, 유연성에 용이
   • 한 layer에서 문제가 발생해도 다른 layer에 영향을 주지 않음
   • layer가 분리되어 있으므로 layer별 테스트가 가능

🟢 Express 디자인 패턴

View는 FrontEnd에 맡기고, 우리는 Model과 Controller에 집중하면 된다.

일반적인 Express 디자인 패턴 예시들은 다음과 같다.

src
│   app.js          # App entry point
└───api             # Express route controllers for all the endpoints of the app
└───config          # Environment variables and configuration related stuff
└───jobs            # Jobs definitions for agenda.js
└───loaders         # Split the startup process into modules
└───models          # Database models
└───services        # All the business logic is here
└───subscribers     # Event handlers for async task
└───types           # Type declaration files (d.ts) for Typescript

출처 : ideal-nodejs-project-structure

├── app.js          # 실행 주체
├── package.json    # yarn 패키지 관리
├── yarn.lock       # yarn 패키지 잠금
└── src             # 소스 폴더
    ├── modules         # 사용자 지정 모듈
    ├── routes          # 요청에 따른 분리
    ├── controllers     # API 요청/응답 실행
    ├── services        # 데이터 가공
    ├── repository      # DB CRUD
    └── entities        # Model과 동일

출처 : express-design-pattern

🟢 Reference

Bulletproof node.js project architecture 🛡️
$\rightarrow$ https://www.softwareontheroad.com/ideal-nodejs-project-structure/
Express 디자인 패턴
$\rightarrow$ https://seongsu.me/skill/express-design-pattern/
MVC패턴이란
$\rightarrow$ https://m.blog.naver.com/jhc9639/220967034588