Spring + Apache Tiles 설치하기

Apache Tiles 설정하기

Spring + Apache Tiles 설치하기

 

웹페이지를 작성하게 되면 페이지 상단의 글로벌 메뉴 부분, 좌측의 메뉴 부분, 하단의 카피라이트 부분등 항상 공통적으로 나오는 부분이 있습니다.

 

이러한 부분들을 따로 파일로 만들고 페이지 내에서  include 하여 사용을 하게됩니다. 재사용 가능한 조각으로 분리했지만 아직도 남은게 있습니다. 각 페이지에서 include하는 코드는 항상 작성을 해야만 합니다.

 

Apache Tiles 는 템플림 구성 프레임워크로서 이러한 include 하는 코드를 사용하지 않고, 지정된 페이지 레이아웃에 따라 페이지 조각을 조합하여 완전한 페이지로 만들어 줍니다.

 

Spring에서 서비스 단에서 처리된 데이터를 뷰단인 jsp 로 보내기 위해서 View Resolver 를 사용합니다. 기본으로 사용되던 InternalResourceViewResolver 를 TilesViewResolver 로 교체하면 Tiles 가 페이지를 조합해 주는 작업을 처리해 줍니다.

 

이제부터 해볼 예제는 "스프링 프레임웍에서 MyBatis, Oracle 사용하기" 에서 사용한 예제에 타일즈를 추가한 것입니다. 데이터베이스가 없다면 데이터베이스 연결과 BoardList 페이지를 텍스트만 나오는 페이지로 대체해서 적용해보면 되겠습니다.

 

1. pom.xml 파일에 tiles를 사용할 수 있도록 의존성을 추가합니다. Apache Tiles 3.0.5 버전을 사용합니다.

<properties>
	<java-version>1.8</java-version>
	<org.springframework-version>4.3.4.RELEASE</org.springframework-version>
	<org.aspectj-version>1.6.10</org.aspectj-version>
	<org.slf4j-version>1.6.6</org.slf4j-version>
	<apachetiles.version>3.0.5</apachetiles.version>
</properties>

<!-- Apache Tiles -->
<dependency>
	<groupId>org.apache.tiles</groupId>
	<artifactId>tiles-core</artifactId>
	<version>${apachetiles.version}</version>
</dependency>

<dependency>
	<groupId>org.apache.tiles</groupId>
	<artifactId>tiles-api</artifactId>
	<version>${apachetiles.version}</version>
</dependency>

<dependency>
	<groupId>org.apache.tiles</groupId>
	<artifactId>tiles-servlet</artifactId>
	<version>${apachetiles.version}</version>
</dependency>

<dependency>
	<groupId>org.apache.tiles</groupId>
	<artifactId>tiles-jsp</artifactId>
	<version>${apachetiles.version}</version>
</dependency>

 

2. servlet-context.xml 파일에 타일즈 View Resolver 를 추가합니다.

<resources mapping="/resources/**" location="/resources/" />

<beans:bean id="tilesViewResolver" class="org.springframework.web.servlet.view.tiles3.TilesViewResolver">
	<beans:property name="order" value="1"/>
</beans:bean>

<beans:bean id="tilesConfigurer" class="org.springframework.web.servlet.view.tiles3.TilesConfigurer">
	<beans:property name="definitions">
	<beans:list>
		<beans:value>/WEB-INF/views/**/tiles.xml</beans:value>
	</beans:list>
	</beans:property>
</beans:bean>

 

정적 리소스 맵핑 부분은 원래 있던 부분인데, 이곳에 필요한 이미지와 스타일 시트 파일등을 넣게 됩니다. (반드시 이곳에 넣을 필요는 없습니다. 그냥 웹 루트 아래에 있으면 되는데 정적 리소스 지정하는 곳이 있으니까 사용해보는 것일 뿐입니다. 이 리소스 맵핑이 사용되는 곳에 관해서는 다음 기회에 적어 보겠습니다.)

 

tilesViewResolver의 프로퍼티에 order 를 주었습니다. 이 리졸버가 우선적으로 사용되도록 합니다.

 

 

3. tiles 설정 파일을 작성합니다. /WEB-INF/views/tiles/tiles.xml 파일입니다.

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE tiles-definitions PUBLIC
	"-//Apache Software Foundation//DTD Tiles Configuration 3.0//EN"
	"http://tiles.apache.org/dtds/tiles-config_3_0.dtd">

<tiles-definitions>
	<!-- base-definition -->
	<definition name="base-definition"
		template="/WEB-INF/views/tiles/layouts/defaultLayout.jsp">
		<put-attribute name="title" value="" />
		<put-attribute name="header" value="/WEB-INF/views/tiles/template/defaultHeader.jsp" />
		<put-attribute name="menu" value="/WEB-INF/views/tiles/template/defaultMenu.jsp" />
		<put-attribute name="body" value="" />
		<put-attribute name="footer" value="/WEB-INF/views/tiles/template/defaultFooter.jsp" />
	</definition>

	<!-- Home Page -->
	<definition name="home" extends="base-definition">
		<put-attribute name="title" value="Welcome" />
		<put-attribute name="body" value="/WEB-INF/views/home.jsp" />
	</definition>

	<!-- BoarList Page -->
	<definition name="boardList" extends="base-definition">
		<put-attribute name="title" value="List" />
		<put-attribute name="body" value="/WEB-INF/views/boardList.jsp" />
	</definition>

	<!-- BoardView Page -->
	<definition name="boardView" extends="base-definition">
		<put-attribute name="title" value="View" />
		<put-attribute name="body" value="/WEB-INF/views/boardView.jsp" />
	</definition>
</tiles-definitions>

 

base-definition 부분이 페이지 레이아웃을 지정하는 곳입니다. 각각의 공통 조각들을 지정합니다. 그 아래에는 공통이 아닌 부분을 지정하는 곳입니다. 이부분은 extends="base-definition" 에서 알 수 있듯이 위의 기본 설정을 확장하여 바뀌는 부분을 지정합니다. name="home" 부분에 나오는 것은 Controller 에서 뷰를 찾기 위한 반환하는 값이 됩니다.

 

 

4. 다음은 레이아웃을 작성합니다. /WEB-INF/views/tiles/layouts/defaultLayout.jsp 파일 입니다.

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib uri="http://tiles.apache.org/tags-tiles" prefix="tiles"%>
<!DOCTYPE html>
<html lang="ko">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<title><tiles:getAsString name="title" /></title>
	<link href="<c:url value='/resources/css/layout.css' />" rel="stylesheet"></link>
</head>

<body>
	<header id="header">
		<tiles:insertAttribute name="header" />
	</header>

	<section id="sidemenu">
		<tiles:insertAttribute name="menu" />
	</section>

	<section id="siteContent">
		<tiles:insertAttribute name="body" />
	</section>

	<footer id="footer">
		<tiles:insertAttribute name="footer" />
	</footer>
</body>
</html>

 

tiles 태그 라이브러리를 사용해서 include 될 부분을 지정합니다.

 

5. 나머지 부분은 예제를 구성하는 다른 파일들 입니다. 이 파일들의 내용은 첨부 파일을 참조해 주세요.

 

- /WEB-INF/view/tile/layouts 폴더에 있는, 레이아웃을 구성하는 공통 조각 파일 들입니다.
공통 헤더 : defautlHeader.jsp
공통 메뉴 : defautMenu.jsp
공통 풋터 : defaultFooter.jsp

 

- 페이지 body 부분이 될 페이지들입니다. /WEB-INF/views 폴더에 있습니다.
게시판 리스트 : boardList.jsp
게시판 보기 : boardView.jsp
홈 화면 : home.jsp

 

- 이미지와 css 파일입니다 /resources/css, /resources/img 폴더 입니다.
페이지 레이아웃 CSS : layout.css
로고 이미지 : log.png

 

 

6. 실행결과 입니다.

 

 

 

이상으로 Apache Tiles 를 설치해서 사용하는 간단한 예제를 해보았습니다. tiles 는 페이지 공통부분의 재사용을 간편하게 해주는 프레임워크 입니다.

이 예제에서는 body 가 되는 페이지를 일일이 설정파일에 기술했지만, 큰 프로젝트에서 이렇게 사용할 수 는 없을 것입니다. 타일즈를 설정하는 방법에 대해서 다음에 알아보도록 하겠습니다.

 

※ 예제 소스

Spring_ApacheTiles.zip

다운로드