[node.js] MVC패턴과 openAPI(RESTful)

 

현재 MVC 패턴으로 Node 개발을 하는 것과, openAPI를 통해 Node를 개발하는것 두가지를 배우고 있다.
해당 포스트는 두개의 개념을 정리하기 위해 작성하였다. 
개발환경은 node express에 .ejs 확장자를 사용한다.

 

우선 두가지의 차이?

 

MVC 패턴 기반 

-

프론트엔드 도움없이 백엔드 개발자가 원맨쇼를 하는 개발이라고 보면 된다.

백엔드 쪽에서 정적 html와 같은 화면단도 제어해주기 때문이다. 응답을 처리할땐 POST와 GET 형식을 주로 사용한다. 사용자가 브라우저에서 요청을 하면 일단 View(화면단) 을 던져주어야 하므로 GET으로 화면을 가져온다. 그리고 사용자가 입력하고 저장 혹은 보내기를 누르는 액션을 실행하면 POST 방식으로 데이터를 받아서 처리를 해주는 식이다.

앞서 말했듯이 MVC 패턴은 백엔드 개발자가 혼자 다 할수 있으므로 open api를 쓰지 않는다.

 

OpenAPI(RESTful)

-

개발을 진행할때 프론트엔드 : 백엔드 로 아예 나누어져있을때 이렇게 개발한다.

ajax나 restful service로 구현을 하는데, 생짜 ajax의 경우 코드가 너무 길기때문에 제이쿼리를 주로 이용한다.

RESTful은 화면이고 UI고 뭐고 필요없는 순수 데이터 처리만 담당하는 API를 말한다. 

보통은 OpenAPI 자바스크립트를 따로 빼놓는 편이다.

 

 

---

 

Case1 ) MVC 패턴 기반 백엔드에서 모든 일을 다 하는 경우 (node 개발)

 

프론트엔드가 해야할 브라우저에 띄워줄 HTML 조작도 백엔드에서 전달해준다.

 

Model :

데이터조작 (ORM = DATA Model)

ORM(Object Relative Mapping) 이란? 
생성한 프로그램이 종료되더라도 사라지지 않는 데이터의 특성을 말한다. 
객체지향프로그래밍은 클래스를 사용하고 관계형 데이터베이스는 테이블을 사용한다. 이 두가지를 사용할때 객체지향 모델과 관계형 모델간에 불일치가 존재하는데, 이를 ORM을 통해 객체 간의 관계를 바탕으로 SQL을 생성하여 해결한다.

VIEW :

화면(UI)를 제공하고 ViewEngine 기술(ejs 혹은 pug)를 이용해 HTML을 서버측에서 변조하여 브라우저에 전달한다.

브라우저는 전달받은 데이터 (0,1로 이루어져있음) 를 해석만해서 사용자에게 보여주기만 한다.

 

Controller:

Route와 동일하며 사용자가 URL(주소)를 호출하면 해당 호출주소에 맞는 화면이나 데이터를 전송하고 제어한다.

사용자가 URL(Unified Resouce Locator) 혹으 URI(Unified Resouce Indicator)를 통해 어플리케이션의 리소스를 호출하면 Controller가 가장 먼저 호출된다.

 

예제를 보자면

test.io/member/list

위와 같은 URL을 사용자가 호출했다고 하자. 그럼 member라는 컨트롤러(라우팅) 파일을 찾고 해당 파일내에 list라는 액션(라우팅) 메소드를 호출하는 것이다.

 

라우팅 메서드가 할 수 있는 일

1. 데이터가 필요하다면 Model 영역에서 데이터모델을 이용해 데이터를 조회하거나 데이터를 등록/수정/삭제 할 수 있다.

2. 데이터만 브라우저에 제공하고자하면 res.json(데이터)를 호출하여 바로 브라우저에 json 데이터를 전송한다.

3. 특정 HTML 화면만 제공하고자하면 res.render(뷰파일명) 으로 호출하여 이 view 파일내 정적 HTML만 제공할수 있다.

4. 특정 HTML 화면에 데이터까지 전달해서 view engine 문법을 이용해 HTML을 동적으로 변조하여 최종 결과물을 브라우저에 전달할 수 있다.

 

 

위처럼 데이터를 다루는 것, 이 데이터를 브라우저에 뿌려주는 것, 데이터를 변경하는 것, 변경된 데이터를 다시 뿌려주는 것 등등...

모든걸 백엔드에서 처리할 수 있기 때문에 백엔드 원맨쇼라고 부르는 것이다.

 

 

---

 

Case 2) 프론트엔드 영역과 백엔드 영역을 나눠서 개발한다. 

 

프론트엔드의 역할 

 

- 백엔드에 정적 웹페이지 제공을 요청한다.

- 백엔드에 순수 JSON 데이터를 요청한다.

- 제공된 JSON 데이터와 웹페이지를 기반으로 HTML 소스를 동적으로 브라우저 측에서 HTML 변조(조작) 한다.

 

백엔드의 역할

 

- 프론트에 제공할 정적 웹페이지를 제공한다.

MVC 패턴으로 제공하거나 정적페이지를 제공하거나 둘 중 한가지이다.

 

MVC 패턴 URL	정적페이지 URL
www.test.io/member/list	www.test.io/member/list.html

 

- REST API(Open API) 를 통해 데이터 처리 및 데이터 정보를 제공한다.

- REST API 라우팅 규칙 정의 및 관련 라우팅 메소드 기능을 구현하고 제공한다.

- DATABASE를 관리한다.