[aws] 서버 템플릿 엔진과 클라이언트 템플릿 엔진

---

책에 나온 예시로 설명을 하겠습니다. 서버 템플릿 엔진엔 대표적으로 JSP가 있죠. 클라이언트 템플릿 엔진엔 React,Vue,Mustach가 있습니다.

서버 템플릿 엔진

아래 코드의 결과로 어떤게 옳을까요?

1. 조건이 맞으면 ‘test’가 출력된고 아니면 출력되지 않는다.
2. 조건과 관계없이 ‘test’가 출력되지 않는다.
3. 조건과 관계없이 ‘test’가 출력된다.

   <script type="text/javascript">
     $(document).ready(function(){
    if( a == 1 ){
        <% System.out.println("test"); %>
    }  
     });
   }
   </script>
   

답은 3번입니다. if문은 javascript로 클라이언트의 브라우저에서 해석이 되기 때문에 서버에선 EL 태그의 명령문만 실행합니다. 그림과 같이 서버에서 데이터를 이용해 HTML까지 만든 후에 사용자에게 전달합니다.

클라이언트 템플릿 엔진

SPA(Single Page Application)이라고 합니다. 그림처럼 서버에선 데이터만 받고 보여지는 페이지는 클라이언트에서 만들어집니다. 요즘엔 자바스크립트 프레임워크에서 서버 사이드 렌더링을 지원하는 리액트나 뷰가 사용됩니다. 서버로부터 완전한 새로운 페이지를 불러오지 않고 현재의 페이지를 동적으로 다시 작성합니다.