Free Online Courses for Software Developers - MrBool
× Please, log in to give us a feedback. Click here to login
×

You must be logged to download. Click here to login

×

MrBool is totally free and you can help us to help the Developers Community around the world

Yes, I'd like to help the MrBool and the Developers Community before download

No, I'd like to download without make the donation

×

MrBool is totally free and you can help us to help the Developers Community around the world

Yes, I'd like to help the MrBool and the Developers Community before download

No, I'd like to download without make the donation

How to create a web application using Spring MVC 3.2

This tutorial is about to create a web application using Spring MVC. A demo application will create an index page and welcome page with its header, footer, right pane and body module separated using tiles framework.

Spring MVC is used to create MVC pattern for web application and tiles framework is the mechanism to create web application template.

The objective of this tutorial is:

  • What is spring MVC?
  • How do we create web application using Spring MVC 3.2?

Web Application Development using Spring MVC 3.2:

To create a web application base on MVC pattern, we need to pay attention for Model, View and Controller. All the request hits to Controller first that are passed to Models and Views respectively as per the requirement. The MVC pattern is managed in this application by Spring MVC. The spring framework deals with bean factory object creation and its manipulation. An object is created using spring bean factory and handed over to the requested object. Let us have a look on an example that was created using Eclipse IDE.

To create a this web application, we are required Eclipse IDE, JDK5 Runtime Environment, Tomcat Apache 7 web server with Spring 3.2 jar files. Now go to “File->New->Dynamic Web Project” from “select a wizard” and press “Next”. Give a project name, set target runtime to “Tomcat Apache 7” that has been configured to server, select “Dynamic web module version” to 3.0 and press Finish”. This will create a directory structure as shown in the following figure.

Application Directory Structure

Figure 1: Application Directory Structure

We are required to add a set of spring jar files with this project. To add these jar files into this project, right click on project and choose “Build Path->Configure Build Path” click on “Libraries” tab and choose or create a user library or add jar files directly using “Add External JARs”.

Required Jar Files

Figure 2: Required Jar Files

These are the required list of jar files.

All the request comes to deployed web application will hit the deployment descriptor xml file web.xml.

Listing 1: web.xml

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns="http://java.sun.com/xml/ns/javaee" xmlns:web="http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd" 
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"
id="WebApp_ID" version="2.5">
  <display-name>SpringMVCApp</display-name>
  <welcome-file-list>
    <welcome-file>index.jsp</welcome-file>
  </welcome-file-list>
  <servlet>
    <servlet-name>springmvcapp</servlet-name>
    <servlet-class>
            org.springframework.web.servlet.DispatcherServlet
        </servlet-class>
    <load-on-startup>1</load-on-startup>
  </servlet>
  <servlet-mapping>
    <servlet-name>springmvcapp</servlet-name>
    <url-pattern>*.html</url-pattern>
  </servlet-mapping>
</web-app>

The above code loads index.jsp file bydefault and all the rest of requests are transferred to spring configuration file using DispatcherServlet class defined in org.springframework.web.servlet. This class is loaded on startup, while an application is deployed.

Listing 2: springmvcapp-servlet.xml

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xmlns:p="http://www.springframework.org/schema/p"
    xmlns:context="http://www.springframework.org/schema/context"
    xsi:schemaLocation="http://www.springframework.org/schema/beans
http://www.springframework.org/schema/beans/spring-beans-3.0.xsd
http://www.springframework.org/schema/context
http://www.springframework.org/schema/context/spring-context-3.0.xsd">

    <context:component-scan base-package="com.springmvcapp.controller" />
    <bean id="viewResolver"
        class="org.springframework.web.servlet.view.UrlBasedViewResolver">
        <property name="viewClass"
            value="org.springframework.web.servlet.view.JstlView" />
        <property name="prefix" value="/WEB-INF/jsp/" />
        <property name="suffix" value=".jsp" />
    </bean>
</beans>

The springmvcapp-servlet.xml file defines a directory for controller and view portion of the application. The base-package name “com.springmvcapp.controller” is loaded with its sub-packages and java class files to be managed as controller and models. The directory name “WEB-INF/jsp” contains all the view for the application.

Listing 3: HelloWorld.java

package com.springmvcapp.controller;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.servlet.ModelAndView;
@Controller
public class HelloWorld {

    @RequestMapping("/helloworld")
    public ModelAndView helloWorld() {
        String message = "<br><div align='center'><h1>Hello from HelloWorld controller.<h1>this is from method 1st<br>";
        return new ModelAndView("welcome", "message1", message);
    }
    @RequestMapping("/helloworld1")
    public ModelAndView helloWorld2() {
        String message = "<br><div align='center'><h1>Hello from HelloWorld controller.<h1><br>this is from method 2nd";
        return new ModelAndView("welcome", "message1", message);
    }
}

The above code defines a HelloWorld java class file that defines a “helloworld” controller using @Controller annotation class defined in org.springframework.web.bind.annotation package. This annotation defines that the defining class is being manipulated as a controller for the application. We can define a specific string to be mapped by the url. @RequestMapping annotation is used to define mapped string type that will be mapped to the requested url to reach the “HelloWorld” controller. “helloworld” string is defined as mapped string as follows:

@RequestMapping (“/helloworld”)

This annotation is method specific and defined before the method definition.

This class defines a method helloworld() that return data object to ModelAndView class type that loads the “welcome” jsp file with the message variable name “message1” using the string variable “message” defined in class.

Listing 4: WEB-INF/jsp/welcome.jsp

<html>
<head>
    <title>Spring MVC App</title>
</head>
<body>
    ${message1}
</body>
</html>

The above code defines a jsp file that is loaded by the “helloworld” controller and displays the message that is passed by the controller method “helloworld” using “ModelAndView” class. A variable “message1” is passed by controller to welcome.jsp to display a message. To display the information passed from the controller, we use ${variable-name-passed-by-controller} syntax as follows:

${message1}

Where message1 is the variable passed by the controller.

Listing 5: index.jsp

<html>
<head>
<title>Spring MVC App | Index</title>
</head>
<body>
	<br>
	<div align='center'>
	<h2>
		WELCOME TO SPRING MVC APP     
		<a href="helloworld.html">Load Controller method 1</a><br>
		<a href="helloworld1.html">Load Controller method 2</a>
	</h2>
	</div>
</body>
</html>

The above code displays the index.jsp file that is loaded by default, while the application is deployed on the web server and the application calls the default page to be loaded. This page displays the default message and a two url for “helloworld” and “helloworld1” requests to the controller using url “helloworld.html” and “helloworld1.html”.

Here one thing is to note that a single jsp file is being loaded for two different requests with two different views.

Now to deploy the application on the server, right click on the application directory structure and choose “Run As->Run on Server” that opens “Run on Server” wizard and choose the server configured with the Eclipse IDE. Press next or finish button to deploy the web application on the server immediately. Once the application has been deployed on the server, a new browser tab will be opened with its startup page. The url http://localhost:8080/spring_mvc/ will open the deployed application into the web browser.

Application Running into the browser

Figure 3: Application Running into the browser

The above figure shows the running application into the web browser that was deployed on the web server with the application name “spring_mvc”. It loads the default jsp page with the url: http://localhost:8082/spring_mvc

There are two request to the HelloWorld controller which are defined inside the page using the anchor tag with the url: helloworld.html and helloworld1.html

helloworld.html

Figure 4: helloworld.html

The figure 4 shows the HelloWorld controller request hitting to helloworld method with the url: http://localhost:8082/spring_mvc/helloworld.html

helloworld1.html

Figure 5: helloworld1.html

The figure 5 shows another request “helloworld1” hitting to the “HelloWorld” controller using the url: http://localhost:8082/spring_mvc/helloworld1.html

Conclusion:

In this article, we learn:

  • What is spring MVC?
  • How do we create web application using Spring MVC 3.2?


Working in Software Development domain from 7 years now and is well equipped with programming languages like HTML, CSS, Java, PHP, .NET etc.

What did you think of this post?
Services
[Close]
To have full access to this post (or download the associated files) you must have MrBool Credits.

  See the prices for this post in Mr.Bool Credits System below:

Individually – in this case the price for this post is US$ 0,00 (Buy it now)
in this case you will buy only this video by paying the full price with no discount.

Package of 10 credits - in this case the price for this post is US$ 0,00
This subscription is ideal if you want to download few videos. In this plan you will receive a discount of 50% in each video. Subscribe for this package!

Package of 50 credits – in this case the price for this post is US$ 0,00
This subscription is ideal if you want to download several videos. In this plan you will receive a discount of 83% in each video. Subscribe for this package!


> More info about MrBool Credits
[Close]
You must be logged to download.

Click here to login