상세 컨텐츠

본문 제목

[WEB] 템플릿 엔진이란

갭알/WEB

by ranlan 2021. 3. 27. 01:23

본문

728x90

템플릿 엔진이란?

동적 컨텐츠를 생성하는 방법으로 스프링 MVC(Model, View, Controller) 중 VIEW에 해당한다.

jsp, thymeleaf,  Apache Freemarker, Mustache, Groovy Templates 등 여러 템플릿 엔진이 존재한다.

  • 클라이언트 사이드 템플릿 엔진
    HTML 형태의 코드로 작성되며 데이터를 받아 DOM 객체에 동적으로 그려주는 프로세스 담당한다.
  • 서버 사이드 템플릿 엔진
    서버에서 가져온 데이터를 미리 정의된 템플릿에 넣어 HTML을 그린 뒤 클라이언트에 전달한다.

 

 

JSP

JSP 내에서 자바 코드 사용 가능 (사용하지 못하도록 설정도 가능하나 jsp 내부에 비지니스 로직이 포함된 자바코드 넣는 것 지양 )

서블릿으로 변환되어 실행

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>

<!DOCTYPE html>
<html lang="ko">
<head>
    <meta charset="UTF-8">
    <title>JSP</title>
</head>
<body>
<div class="container">
    <table class="table">
        <thead>
        <tr>
            <th>번호</th>
            <th>게시물 제목</th>
            <th>작성자</th>
            <th>게시물 내용</th>
            <th>조회수</th>
            <th>추천수</th>
        </tr>
        </thead>
        <tbody>
        <c:forEach var="board" items="${boardList}" varStatus="status">
            <tr>
                <td><c:out value="${board.boardNo}">${board.boardNo}</c:out></td>
                <td><c:out value="${board.boardNm}">${board.boardNm}</c:out></td>
                <td><c:out value="${board.memberNm}">${board.memberNm}</c:out></td>
                <td><c:out value="${board.boardContent}">${board.boardContent}</c:out></td>
                <td><c:out value="${board.boardViewCnt}">${board.boardViewCnt}</c:out></td>
                <td><c:out value="${board.boardRcmdCnt}">${board.boardRcmdCnt}</c:out></td>
            </tr>
        </c:forEach>
        </tbody>
    </table>
</div>
</body>
</html>
  • JSTL (Java Server Pages Tag Library)
    • Java EE 기반의 웹 어플리케이션 개발 플랫폼을 위한 컴포넌트 모음으로 c태그 생각하면 됨
    • JSP 코드를 관리하는 태그 라이브러리이며 JSP의 가독성을 향상시킴
    • JSP 페이지 내에서 자바 코드를 바로 사용하지 않고 로직을 내장하는 효율적인 방법 제공
  • EL (Expressioin Language)
    • 데이터를 표현하기 위한 언어
    • <%%>, <%=%>과 같은 자바 코드 대신 ${}와 같은 다른 표현식을 사용함으로 써 자연스러운 형태로 태그의 속성값 지정

 

Thymleaf

웹 및 독립형 환경에서 html, xml, js, css 등을 처리할 수 있는 자바 템플릿 엔진이다.

퍼블리셔가 페이지를 생성하거나 수정할 때 웹서버를 실행하지 않고도 오프라인에서 수정 가능하다.

또한 html 엘리먼트 속성으로 값을 넣어주기 때문에 웹 서버를 가동시키지 않아도 브라우저에서 확인 가능하다.

<!DOCTYPE html>
<html lang="ko" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Thymeleaf</title>
</head>
<body>
<div class="container">
    <table class="table">
        <thead>
        <tr>
            <th>번호</th>
            <th>게시물 제목</th>
            <th>작성자</th>
            <th>게시물 내용</th>
            <th>조회수</th>
            <th>추천수</th>
        </tr>
        </thead>
        <tbody>
        <tr class="text-center" th:each="board : ${boardList}">
            <td> <span th:text="${board.boardNo}"/> </td>
            <td> <span th:text="${board.boardNm}"/> </td>
            <td> <span th:text="${board.getMember().memberNm}"/> </td>
            <td> <span th:text="${board.boardContent}"/> </td>
            <td> <span th:text="${board.boardViewCnt}"/> </td>
            <td> <span th:text="${board.boardRcmdCnt}"/> </td>
        </tr>
        </tbody>
    </table>
</div>
</body>
</html>

 

 

JSP와 Thymleaf 비교

JSP를 권장하지 않는 이유

스프링 부트에서 Thymleaf는 자동으로 의존성이 포함되어 있으며 설정 또한 자동으로 지원하는 반면 JSP는 그렇지 않음

  • JSP의 경우 JAR 패키징을 할 수 없어 WAR 패키징을 해야한다.
  • JSP와 달리 Thymleaf는 서블릿 코드로 변환되지 않아 비지니스 로직과 분리되어 오로지 View에 집중할 수 있다.
  • was를 통하지 않고 html을 열 수 있다.

아직 thymleaf를 제대로 써보지도 않았고 잘 몰라서 다른건 잘 못느끼겠다. 직접 써보면서 익혀야할 듯!

 

728x90

관련글 더보기

댓글 영역