본문 바로가기

Web Development/Back-end

MVC Pattern ( Model & View & Controller )

안녕하세요.

오늘은 웹개발을 하다보면 접하게 되는 기본개념중 하나인 MVC 패턴에 대해 간략히 알아보려고 합니다.

 

1. MVC 패턴의 개념

MVC는 디자인패턴이라고 불리우는 소프트웨어 개발 방법론? 중 하나라고 이해됩니다.

이 외에도, 유명한 패턴 중에는 MVP, MVVM 패턴 등 그 외에도 수도없이 다양하게 존재합니다.

그 중 가장 기본적인 MVC패턴을 가져와 보았습니다.

MVC패턴은 Model, View, Controller로 구분되어 있으며,

이런 방식으로 개발하는 이유는 역시나 코드의 재사용성과 유지보수의 편리함 때문입니다.

쉽게말해서, 코드를 Model, View, Controller로 분류해서 짠다는 것입니다.

 

MVC패턴에서는 다음과 같이 코드를 분류해서 짜게 됩니다.

 

Model은 DB를 다루는 내용의 코드

View는 화면단, 즉 프론트엔드 혹은 브라우저단을 만드는 내용의 코드

Controller는 백엔드 즉, 기능을 구현하는 코드

 

 

 

2. Model

MVC 패턴이 무엇인지 한번 코드를 보면서 살펴볼까요?

저는 생활코딩 Nodejs&MySQL에서 학습했던 내용의 코드를 가져왔습니다.

 

우선 Model 부분을 한 번 살펴볼까요?

데이터베이스를 다루는 코드라고 했으니깐 아마 이런것들이 아닐까요?

Model

위 코드는 글쓰기 버튼을 누르면 전송되는 데이터를 데이터베이스에 삽입해주는 코드입니다.

그래서 DB.query INSERT문을 사용하고 있습니다.

이런것들을 Model에 해당하는 코드라고 불르고 있습니다.

 

3. View

뷰단은 "View는 화면단, 즉 프론트엔드 혹은 브라우저단을 만드는 내용의 코드" 이런 코드라고 했었죠?

그러니까 화면출력 페이지입니다.

따라서 아마도 이런 코드가 여기에 해당되지 않을까 싶어요.

View

템플릿이라는 화면단을 구성하는 HTML 코드입니다.

더 큰 프로젝트에서는 CSS Javascirpt등이 포함되어 있겠지만, 여기는 없네요 ㅎㅎ;

아무튼 이런것들을 View라고 부르는 것으로 보입니다.

 

4. Controller

컨트롤러는 "Controller는 백엔드 즉, 기능을 구현하는 코드" 라고 설명드렸습니다.

음.. 제가 듣는 수업에서는 따로 분류를 안해둔 것 같아요. 그래서 이 부분은 확실치는 않은데, 

그래서 제 코드 중, 유사한 것으로 가져와보았습니다.

Controller

위 templateList 함수는 목록을 출력하는 코드구요.

아래 autoSelect 부분은 어떤 author인지 선택할수 있는 부분입니다.

그런데,

해당 부분 목록이나 author목록은 언제든 데이터가 추가될 수도 있고,

삭제될 수도 있기에 이것과 무관하게 로직은 변치 않아야합니다.

 

따라서 이렇게 반복문을 이용해서 데이터의 갯수가 변화해도 로직은 그대로 사용할 수 있는 코드를 짜두었는데요.

이런 것들이 아마도 Controller에 해당하지 않을까 싶어요.

 

 

 

☞ 본 포스팅은 공부 내용을 바탕으로 정리하는 것입니다. 주관적이며 정확하지 않은 내용이 포함 되어있을 수 있습니다.