I'll never know if I never commit

MVC 패턴이란 무엇인가? Model-View-Controller의 약자로, 개발시 3가지의 형태로 나누어 개발하는 패턴을 말한다. 어플리케이션 개발 시 사용자 인터페이스 영역과 비즈니스 로직 처리 영역을 분리시킨다. Model 어플리케이션이 무엇을 할지 정의한다. 어플리케이션의 정보, 데이터를 나타낸다. ( 데이터베이스, 변수 , 초기화값 ) 위와같은 정보들의 가공을 책임지는 컴포넌트이다. 사용자가 편집하길 원하는 모든 데이터를 가지고 있어야 한다. 뷰, 컨트롤러에 대해 어떠한 정보더 알아선 안된다. 정보 변경시, 변경 통지에 대한 처리 방법을 구현해야 한다. 모델 속성의 변경시 외부에 알려야하고, 외부에서 모델 속성의 변경을 요구시 이를 처리해야한다. View input 텍스트, 체크박스와 같은 사용..

EJS 템플릿 엔진 ejs는 handlebars와 마찬가지로 기존의 html코드를 유지하되, html코드 안에 바닐라 자바스크립트 코드를 넣어 생산성을 더해준 템플릿 엔진이다. 다른 두 템플릿 엔진과의 가장 두드러진 차이점은 바닐라 자바스크립트를 사용할 수 있다는 점과, 레이아웃을 제공하지 않는다는 점이다. 하지만 레이아웃을 제공하지 않는 대신 include라는 레이아웃과 유사한 기능을 제공한다. 개인적으로 EJS가 가장 편하다고 느꼈다! render하는 방식은 역시나 다른 템플릿과 똑같다. 먼저 npm에서 ejs를 설치해준다. $ npm install ejs 메인 파일에서 app.set을 해준다. ejs는 pug처럼 built in 엔진이므로, engine으로 설정해줄 필요 없이 바로 set하면 된다...

Handlebars 템플릿 엔진 html코드를 더 간결하고, 리유저블하게 만들어줄 수 있는 또 다른 템플릿 엔진에는 'handlebars'가 있다. handlebars는 기존의 html코드를 모두 변경해야하는 pug과 달리 html 코드 내의 별도의 문법이 거의 없고, if문이나 iteration같은 부분만 변경해주면 되기 때문에 ,매우 쉽다. handlebars에서는 pug과 달리 ' products.length > 0 ' 과 같은 연산이 허용되지 않는다. handlebars 템플릿에서는 오로지 ' true or false'만 연산할 수 있기 때문에, js 파일에서 데이터를 보낼 때, 이점을 유의해주어야 한다. // 리스폰스로 템플릿 파일을 보내는 방법은 pug와 동일하니 생략한다. 먼저 아래와 같이 ..

PUG 템플릿 엔진이란? Express에서 지원하는 템플릿 엔진으로서, html코드를 매우 간결화 시킨 문법을 가진다. pug으로 작성된 코드는 컴파일 되어 html로 렌더링 하는 형식으로 매우 생산성이 높고, 재사용성이 높다. 왜 템플릿 엔진을 쓰는가? 이를 위해서는 템플릿 엔진이 어떻게 작동하는지를 알아야 한다. 템플릿 엔진은 외부 소스로부터 데이터 혹은 소스코드를 받아서 컴파일링하고, 그것을 HTML문서로 렌더링한다. 따라서, 정적(static)페이지를 재사용 할 수 있게 해주고, 데이터 베이스나 다른 소스코드로부터 데이터를 받아오고 컴파일링 함으로써 동적(dynamic) 페이지를 만들 수 있게 해준다. 그러면 Pug 템플릿 엔진을 어떻게 사용하는지 알아보자. 먼저 아래와 같이 pug을 깔아준다. ..