[포스코x코딩온] 웹개발자 풀스택 과정 6주차 | MVC패턴

MVC란?

• Model View Controller
• 소프트웨어 설계와 관련된 디자인 패턴

디자인패턴이란?
-> 상황에 따라 자주 쓰이는 설계 방법을 정리한 코딩 방법론

• MVC 이용 웹 프레임워크
  • PHP
  • Django
  • Express
  • Angular 등

MVC 장단점

장점	단점
패턴을 구분해 개발한다.	완벽한 의존성 분리가 어렵다.
유지보수가 용이하다.	설계단계가 복잡하다.
유연성이 높다.	설계 시간이 오래 걸린다.
확장성이 높다.	클래스(단위)가 많아진다.
협업에 용이하다.

MVC 흐름

• Model : 데이터를 처리하는 부분
• View : UI관련된 것을 처리하는 부분(사용자에게 보여지는 부분)
• Controller : View와 Model을 연결해주는 부분

  폴더구조

  	Controller : view와 model 연결하는 부분 model : 데이터 처리하는 부분 routes : 경로 설정하는 부분 views UI 관련 처리

app.js

const indexRouter = require('./routes');// index는 생략 가능
pp.use('/', indexRouter);// localhost:PORT 경로를 기본으로 ./routes/index.js 파일에 선언한대로 동작
a

routes/index.js

const controller = require('../controller/Cmain.js');
~~
router.get('/', controller.main);
router.get('/comments',controller.comments);
module.exports = router;

경로를 controller와 연결해 설정 가능

Controller/Cmain.js

exports.main = (req,res) =>{
  res.render('index');
};

exports.comments = (req, res) =>{
  res.render('comments');
};

• 경로와 연결된 함수 내용을 정의
• 경로와 연결되는 함수이기에 req객체와 res객체를 사용 가능

Controller - model

const comment = require('../model/Comment');
exports.main = (req, res) =>{
  res.render('index');
};

exports.comments = (req,res) =>{
  res.render('comments',{commentInfos: Comment.commentInfos()});
};

컨트롤러와 모델을 연결