Tech Blog of Pinomaker
Published 2022. 11. 14. 01:22
Template Engine(템플릿 엔진) CS/Web
참고 사이트 : https://velog.io/@hi_potato/Template-Engine-Template-Engine

Template Engine

지정된 템플릿 양식과 데이터가 합쳐져서 HTML 문서를 출력하는 소프트웨어

 

Web Template Engine는 View(Html)와 Data Logic(DB)와 분리해주는 기능을 하며, 템플릿 엔진은 서버 사이드 템플릿 엔진과 클라이언트 사이드 템플릿 엔진으로 나누어진다.

 

 

Server Side Template Engine

서버에서 DB 혹은 API에서 가져온 데이터를 미리 정의된 Template에 넣어서 HTML을 그리고 클라이언트에 전달해주는 역할을 수행하는 데, HTML 코드에 정적으로 사용되는 부분을 템플릿으로 만들어두고 동적으로 생성되는 부분(데이터)만 템플릿 특정 장소에 끼우는 방식으로 동작하게 해준다.

 

 

 

동작 원리를 보면 먼저 Client의 요청을 받으면 DB나 API에서 가져온 데이터를 미리 정의된 Template에 배치하고 서버에서 HTML를 그린 후 Client에 전달한다.

 

여기서 중요한 것은 Server에서 데이터를 랜더링 해서 HTML 형태로 Client에 넘겨준다는 것이다.

 

Client Side Template Engine

HTML 형태로 코드를 작성할 수 있으며, 동적으로 DOM을 그리게 해주는 역할이며, 데이터를 받아서 DOM 객체에 동적으로 그려주는 프로세스를 담당하고 있다.

 

 

즉 클라이언트에서 공통적인 프레임을 미리 Template으로 만들어두고, 필요한 데이터를 서버로부터 가져오면 데이터를 Template에 배치하고 DOM 객체에 동적으로 그려주는 데, 여기서 중요한 것은 Server로부터 데이터를 받아오고 HTML로 만드는 랜더링은 Client에서 한다는 것이다.

 

Template 엔진을 사용하면 아래와 같은 장점이 있다.

 

많은 코드를 줄일 수 있다. 

대부분의 템플릿 엔진은 기존의 HTML에 비하여 간단한 문법을 사용한다.

 

재사용성이 높다.

똑같은 디자인 페이지에 보이는 데이터가 바뀌는 경우가 많다.

 

유지 보수에 용이하다.

하나의 템플릿을 만들어 여러 페이지를 랜더링한다.

'CS > Web' 카테고리의 다른 글

Cookie, Session, Cache  (0) 2022.11.18
profile

Tech Blog of Pinomaker

@pinomaker

포스팅이 좋았다면 "좋아요❤️" 또는 "구독👍🏻" 해주세요!