Sample Spring MVC Application Using Spring Boot and Thymeleaf

Technology Stack

Project Structure

Screen Shot 2020-02-23 at 6.56.17 PM

pom.xml

Add the below in pom.xml

  • spring-boot-starter-parent – add this as parent

Add the below spring boot starters

  • spring-boot-starter-web – needed for spring mvc
  • spring-boot-starter-thymeleaf – needed for thymeleaf
<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
	xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 https://maven.apache.org/xsd/maven-4.0.0.xsd">
	<modelVersion>4.0.0</modelVersion>
	<parent>
		<groupId>org.springframework.boot</groupId>
		<artifactId>spring-boot-starter-parent</artifactId>
		<version>2.7.14</version>
		<relativePath/> <!-- lookup parent from repository -->
	</parent>
	<groupId>com.spring.mvc.config</groupId>
	<artifactId>mvc</artifactId>
	<version>0.0.1-SNAPSHOT</version>
	<name>mvc</name>
	<description>Spring MVC Application Using Spring Boot and Thymeleaf</description>
	<properties>
		<java.version>11</java.version>
	</properties>
	<dependencies>
		<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-starter-thymeleaf</artifactId>
		</dependency>
		<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-starter-web</artifactId>
		</dependency>

		<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-starter-test</artifactId>
			<scope>test</scope>
		</dependency>
	</dependencies>

	<build>
		<plugins>
			<plugin>
				<groupId>org.springframework.boot</groupId>
				<artifactId>spring-boot-maven-plugin</artifactId>
			</plugin>
		</plugins>
	</build>

</project>

Application class annotated with @SpringBootApplication

package com.spring.mvc.config;

import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;

@SpringBootApplication(scanBasePackages = "com.spring.mvc.controller")
public class Application {

	public static void main(String[] args) {
		SpringApplication.run(Application.class, args);
	}

}

Controller Layer

package com.spring.mvc.controller;

import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestParam;

@Controller
public class ApplicationController {
 
@GetMapping("/")
    public String landingPage(Model model) {
       return "landing";
    }
 
@PostMapping("/welcome")
  public String welcome(@RequestParam("name") String name, Model model) {
     model.addAttribute("name", name);
     return "welcome";
  }
 
}

View Layer

Thymeleaf is a default template used by Spring Boot.
By default, Spring Boot looks for the templates in src/main/resources/templates location.

Add the html files inside src/main/resources/templates

landing.html

<html xmlns:th=″http://www.thymeleaf.org″>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Application</title>
</head>
<body>
<h3>Spring MVC Application using Spring Boot and Thymeleaf</h3>
<br/>
<br/>
<div class="form">
<form action="welcome" method="post">
<table>
<tr>
<td>Please Enter Your Name</td>
<td><input id="name" name="name"></td>
<td><input type="submit" value="Submit"></td>
</tr>
</table>
</form>
</div>
</body>
</html>

welcome.html

<html xmlns:th=″http://www.thymeleaf.org″>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Application</title>
</head>
<body>
<h3>Spring MVC Application using Spring Boot and Thymeleaf</h3>
<br/>
<br/>
<h2>Entered name is [[${name}]]</h2>
<div class="form">
<form action="/" method="get">
<table>
<tr>
<td><input type="submit" value="Go back"></td>
</tr>
</table>
</form>
</div>
</body>
</html>

Running Application

Execute the main method of Application.class and then hit http://localhost:8080

Screen Shot 2020-02-23 at 7.16.02 PM

Enter name and click submit button

Screen Shot 2020-02-23 at 7.16.14 PM
Screen Shot 2020-02-23 at 7.16.23 PM

Click Go back button. It will load the landing page.

Screen Shot 2020-02-23 at 7.16.32 PM

Code

Github Link : SpringBootMVC Code

Leave a Reply

Your email address will not be published. Required fields are marked *