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.

Application Development – Spring MVC – Source


I tried putting up a Spring MVC based application from scratch – means standard tomcat 6, created ant builds and try how easy it is to build a ground up application using SpringMVC.

First. Spring MVC Project:

Add Necessary JARS on the Library Folder (Classpath / Buildpath).

Then, integrate Spring by calling the Spring Context Loader passing the xml files where all Beans are specified. Also call the ResourceResolver Servlet so that we can programmatically manage all URL’s coming in and out of the system.

 

 

The ContextLoaderListener is a Listener Object that is primarily used to pre-load objects needed for the application to run. For this example, we are passing an XML file full of Beans and we will allow the Listener to instantiate them on the application server pool.

The DispatchServlet is what we will use to control our URLs of the application, we need to protect our URLs from attacks and outside injections, this object will allow developers to put some barriers (naming) between the client and the actual page directory.

Second. Integrate it with Template, using Tiles:

Copying all JSP files to create a consistent look and feel is just not efficient, I find tiles and jsf templating very easy to use and learn. I have chosen to use Tiles in this project to showcase its re-usability (you can use tiles on any Web Application Framework – as it only requires you to include a class and call it via filter, servlet or listener).

Add Necessary JARS on the Library Folder (Classpath / Buildpath).

Then, the Actual Call to integrate Tiles Templating (for more info visit: http://tiles.apache.org/)

I find Tiles very flexible and easy to learn. You can define your template profiles and configuration on a single XML file.

Third Step: View – Layer (JSP)

The Resolve declartion above is using the properties file called view.properties:

 

 

A property file where the actual location of the JSP is indicated – and mapped to a name (login).

JSP Page:

 

 

Third Step: Controller – Layer

Spring’s controller framework is very flexible and simple. Developers can us the ResourceBundleResolver to protect URLs and use 3 kinds of Controller Object for transactions.

Controller Class: Calls the “login”

The controller doesn’t know the actual page value, its just knows the name associated to the page.

Fourth Step: Service / Model – Layer

GoF = Program to an Interface, not to an implementation – to hide the actual implementation from the client.

Hiding the actual implementation can be done using Autowiring and Autowiring can be done by putting an @Autowired annotation on your service field or property call:

 

I didn’t do any Database Call here yet, but the same process apply, create a new DAO layer call, put it on the XML file and use Springs Autowiring from the Service layer to access it.

Special Note: Put <context:annotation-config /> on xml that has beans that calls layer calls – Service to Dao Calls or Controller to Service Calls).

After all is setup (View to Controller to Model), Build your application and run it on any J2EE Complaint Container. 🙂

Fifth Step: Build WAR and deploy!

Click here to download the sample project.

Note: The Application is a bit large since I put all the Library and other resource on the WAR. By practice, I believe putting some resources outside the archive is very beneficial to the deployment since it reduces the extraction load from the server and optimize the size of the application archived.

Enjoy!