Spring MVC 3 with Template using Apache Tiles


An efficient design consideration for any web application is the use of a template engine (or tool), and with Spring’s “pluggable” nature, it is indeed much more easier to integrate template mechanisms such as Apache Tiles.

In this simple post, I will give you a brief intro and basics of using Tiles as a Template engine for your Web Application! :)

  1. Get it Ready: Web Application Setup
  2. Setup Maven and Import the Spring-MVC libraires plus the Apache Tiles
  3. Configuration File
  4. Tiles
  5. Use it!

1st: Web Layout and Application Setup: Get your Web Application Framework ready. For this example, I used Spring 3 MVC with all the minimal components readily injected. Download it here. The project is eclipse ready, so you can just import and load it on your STS (Spring Tool Suite) workspace.

2nd: Setup Maven and generate sources - STS already has a Maven Plugin support. Put a Maven nature first on the project by right clicking on > project > configure > Convert to Maven project.

3rd: POM Configuration  – Load the Tiles on the pom.xml. – You need to include the following dependencies to add Apache Tiles libraries to the project.

<!-- For Tiles -->
<dependency>
<groupId>org.apache.tiles</groupId>
<artifactId>tiles-core</artifactId>
<version>2.2.2</version>
<type>jar</type>
<scope>compile</scope>
</dependency>
<dependency>
<groupId>org.apache.tiles</groupId>
<artifactId>tiles-template</artifactId>
<version>2.2.2</version>
<type>jar</type>
<scope>compile</scope>
</dependency>
<dependency>
<groupId>org.apache.tiles</groupId>
<artifactId>tiles-jsp</artifactId>
<version>2.2.2</version>
<type>jar</type>
<scope>compile</scope>
</dependency>
<dependency>
<groupId>org.apache.tiles</groupId>
<artifactId>tiles-servlet</artifactId>
<version>2.2.2</version>
<type>jar</type>
<scope>compile</scope>
</dependency>

4th: XML Configuration for Class loaded beans - Make sure to setup the tiles xml and call it either directly or from another xml bean configuration file.

5th: Templates – Create the templates.

tiles-definition: – Define the page using the template (mainTemplate.jsp)

mainTemplate.jsp – is the page layout – put the definition attributes.

The registerUser is the page that will be called, the body-position attribute is replaced by a body we defined: jsp/userregistration.jsp

6th: Configure database. Go to data-access-config.xml in your META-INF folder.

SQL Script:

delimiter $$

CREATE DATABASE `MDCDB` /*!40100 DEFAULT CHARACTER SET latin1 */$$

delimiter $$

CREATE TABLE `MDC_USERS` (
`ID` int(11) unsigned zerofill NOT NULL AUTO_INCREMENT,
`NAME` varchar(45) DEFAULT NULL,
PRIMARY KEY (`ID`)
) ENGINE=InnoDB AUTO_INCREMENT=4 DEFAULT CHARSET=latin1$$

 

Run the Application! :)

With the quality and quantity of application development tools, using templates is not new. Creation of these are now strictly mandatory as it will really help the development team to create quality UI faster and better. It also allows developers and designers to work in parallel. Designers using a themeing API, let say JQuery and developers creating the backbone and logic of the application – using EJBs, makes the definition of “ease of development” more apparent.

Download my sample and open it in your STS (Spring Tool Suite) here. Make sure you have the Hibernate and Maven Plugin installed.

About these ads

8 thoughts on “Spring MVC 3 with Template using Apache Tiles”

    1. It won’t, we need to the tiles resolver for the framework to identify that all the pages are using the tiles template engine. The Configurer is also needed so that we can inject custom configuration on the tiles engine.

      Hope this helps,

  1. Hi all!

    Thanks for the post. It is works for me very well.

    But How can I display dynamic data in a head/footer? For example I would like to display the user’s unread message number, and some information whick come from the database in the Head tile?

    It is a bad design that assign in every controller this information, because in every controller I must do that, and this is not manageable!

    Is there any way for the ReversePresenter Pattern (Like in GoogleWebToolkit – every view known there own presenter, and can ask data from it)?

    Or how other way can I assign dynamic information in a tile, which always show?

    Thanks
    Barney

    1. Hi Barney. That is actually an excellent question. What I would do in this case is create an abstract controller that will hold the data that should be passed across the pages. This abstract controller will act as a factory constructor of every controller that will be developed.

      Another solution will be to create a singleton class for all the global variables and data needed. You can then access this values via EL from your headers or footers needed.

      Filters can also be a solution, you just need to create a separate filter for all pages and assign the variables that can be access from the pages.

      I can think of a lot of possible solution for this but I would recommend creating a singleton with application scope for configurations on your header and footers, this is accessible all over the application within its life duration. Then create the abstract controller and inject the singletone class there so that you can access it from your own controller. Note that you can also access singletone class through EL if you don’t want to pass through the controllers.

      Hope this helps.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s