MVC 패턴이란...
딱 단어를 보기만 하면 그게 먼데...라고 생각하게 된다. 그래서 풀어서 보게 되면 Model Vuew Controller의 줄임말이다.
간단히 생각하자면 폴더 구조가 MVC 폴더 구조라고 생각하면 된다.
모델 다음에 뷰 화면 다음에 컨트롤러가 있고 컨트롤러 안에 서비스가 세부적으로 들어가 있는 구조라고 보면 된다.
백번 말로 설명하기보다는 사진 한 장이 훨씬 도움이 될 때가 있다.
위 사진처럼 mvc 폴더 안에 model, view, controller, service가 있는 것이 바로 mvc 폴더 구조이다.
사실 mvc 폴더 안에 있는 view 파일은 프론트엔드 개발자와 백엔드 개발자가 나눠지기 전 백엔드 개발자가 프론트엔드 로직까지 한 번에 html 파일로 만들 때 사용했던 부분이라 지금 우리는 view는 생각하지 않아도 된다.
이렇게 짜여진 구조가 있는 mvc 폴더를 대체 어떨 때 쓰는 걸까?라는 의문이 들 수 있다. 그렇다면 대답해 주는 게 인지상정
백엔드 개발을 하다 보면 index.js 파일에 수많은 API를 만들게 될 것이다. 구조화시킨 API를 컨트롤러에 class로 잡아서 뺀 것이다. 그러니까 공통적인 기능들은 재사용도 할 수 있다. 쉽게 얘기하자면 함수를 호출하는 거라고 볼 수 있다!!
그러면 함수를 호출했기 때문에 API 로직을 다 index.js 파일에 적는 게 아니라 두 줄만 입력함으로써 기능을 구현할 수 있게 만드는 것이다.
이런 식으로 구조화를 시켰는데 여기서 폴더를 좀 더 효율적으로 만들어서 한 번 더 구조화를 시킬 수 있다.
왜 이렇게 복잡하게 자꾸 구조화를 시키냐!라고 생각할 수 있지만 나중에 로직을 수정할 일이 생길 때 폴더 구조화를 시키지 않으면 API에 어떤 걸 쓰고 있는지도 모르고 service인지 model인지 아무것도 모르게 된다. 그래서 가장 유명하고 많이 사용되는 mvc 구조로 폴더를 만든다면 훨씬 효율적으로 사용할 수 있다. 복잡해 보여도 이런 과정을 거쳐 효율적으로 만드는 거기 때문에... mvc 패턴을 잘 이해하고 있어야 한다.
그래서~~ 앞서 사진으로 보여 준 mvc 폴더 구조에 따라서 사용 중인 파일들을 넣어 준다면 편하게 API를 사용할 수 있다.
굉장히 주저리주저리... 늘어 놓게 되었는데 한번 읽어 본다면 mvc 패턴 구조를 이해할 수 있을 거라고 생각한다. 왜냐면 나도 벨로그를 쓰면서 다시 한번 정리가 되었기 때문이다. ㅎㅎ 나는 이론적인 부분을 이해하고 사용해 봐야 좀 더 이해가 빨라지기 때문에 이렇게 정리해 보니 헷갈렸던 부분들이 이해가 된 것 같다.
++ 아!! mvc 폴더에 파일들을 넣어 줄 때 그 파일에 한 import들을 잘 확인하고 import했던 파일들도 같이 넣어 줘야 import 오류가 뜨지 않고 제대로 되는 걸 확인할 수 있다. (나의 경험담.......)
