Spring Boot 2 MVC Web Application Thymeleaf JPA MySQL Example - RameshMF/spring-boot-developers-guide GitHub Wiki

In this article, we will learn how to develop a Spring MVC web application using Spring boot 2, Thymeleaf, Hibernate 5, JPA, Maven, and MySQL database.

1. What we’ll build
2. Tools and Technologies Used
3. Creating and Importing a Project
4. Packaging Structure
5. The Springboot2WebappThymeleafApplication.java File
6. Create a JPA Entity called User.java
7. Create Spring Data JPA Repository - UserRepository.java
8. Create Spring Controller - HomeController.java
9. Configuring MySQL Database
10. Insert SQL Script
11. Create a Thymeleaf View - index.html
12. Running the Application

We are building a simple Spring MVC web application and Thymeleaf as a view.

Output: Create HTML page using Thymeleaf which displays a list of users from MySQL database.

• Spring Boot - 2.0.4.RELEASE
• JDK - 1.8 or later
• Spring Framework - 5.0.8 RELEASE
• Hibernate - 5.2.17.Final
• Maven - 3.2+
• IDE - Eclipse or Spring Tool Suite (STS)
• Tomcat - 8.5+
• Thymeleaf

There are many ways to create a Spring Boot application. The simplest way is to use Spring Initializr at http://start.spring.io/, which is an online Spring Boot application generator.

Look at the above diagram, we have specified following details:

• Generate: Maven Project
• Java Version: 1.8 (Default)
• Spring Boot:2.0.4
• Group: net.guides.springboot2
• Artifact: springboot2-webapp-thymeleaf
• Name: springboot2-webapp-thymeleaf
• Package Name : net.guides.springboot2.springboot2webappthymeleaf
• Packaging: jar (This is the default value)
• Dependencies: Web, JPA, MySQL, DevTools, Thymeleaf

Once, all the details are entered, click on Generate Project button will generate a spring boot project and downloads it. Next, Unzip the downloaded zip file and import it into your favorite IDE.

diagram here

Once we will import generated spring boot project in IDE, we will see some auto-generated files.

1. pom.xml
2. resources
3. Springboot2WebappThymeleafApplication.java
4. Springboot2WebappThymeleafApplicationTests.java

<?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 http://maven.apache.org/xsd/maven-4.0.0.xsd">
		<modelVersion>4.0.0</modelVersion>

		<groupId>net.guides.springboothelloworld</groupId>
		<artifactId>springboot2-webapp-thymeleaf</artifactId>
		<version>0.0.1-SNAPSHOT</version>
		<packaging>jar</packaging>

		<name>springboot2-webapp-thymeleaf</name>
		<description>Demo project for Spring Boot</description>

		<parent>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-starter-parent</artifactId>
			<version>2.0.4.RELEASE</version>
			<relativePath /> <!-- lookup parent from repository -->
		</parent>

		<properties>
			<project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
			<project.reporting.outputEncoding>UTF-8</project.reporting.outputEncoding>
			<java.version>1.8</java.version>
		</properties>

		<dependencies>
			<dependency>
				<groupId>org.springframework.boot</groupId>
				<artifactId>spring-boot-starter-test</artifactId>
				<scope>test</scope>
			</dependency>
			<dependency>
				<groupId>org.springframework.boot</groupId>
				<artifactId>spring-boot-starter-data-jpa</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-thymeleaf</artifactId>
			</dependency>
			<dependency>
				<groupId>org.springframework.boot</groupId>
				<artifactId>spring-boot-devtools</artifactId>
				<optional>true</optional>
			</dependency>
			<dependency>
				<groupId>mysql</groupId>
				<artifactId>mysql-connector-java</artifactId>
			</dependency>
			<dependency>
				<groupId>com.h2database</groupId>
				<artifactId>h2</artifactId>
			</dependency>
		</dependencies>

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

From above pom.xml, let's understand few important spring boot features.

The Spring Boot Maven plugin provides many convenient features:

• It collects all the jars on the classpath and builds a single, runnable "über-jar", which makes it more convenient to execute and transport your service.

• It searches for the public static void main() method to flag as a runnable class.

• It provides a built-in dependency resolver that sets the version number to match Spring Boot dependencies. You can override any version you wish, but it will default to Boot’s chosen set of versions.

All Spring Boot projects typically use spring-boot-starter-parent as the parent in pom.xml.

    <parent>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-parent</artifactId>
        <version>2.0.4.RELEASE</version>
    </parent>

Parent Poms allow you to manage the following things for multiple child projects and modules:

• Configuration - Java Version and Other Properties
• Dependency Management - Version of dependencies
• Default Plugin Configuration

We added the spring-boot-starter-web dependency, it will by default pull all the commonly used libraries while developing Spring MVC applications, such as spring-webmvc, jackson-json, validation-api, and Tomcat.

We added the spring-boot-starter-data-jpa dependency. This pulls all the spring-data-jpa dependencies and adds Hibernate libraries because most applications use Hibernate as a JPA implementation.

Not only does the spring-boot-starter-web add all these libraries but it also configures the commonly registered beans like DispatcherServlet, ResourceHandlers, MessageSource, etc. with sensible defaults.

We haven’t defined any of the DataSource, EntityManagerFactory, or TransactionManager beans, but they are automatically created. How? If you have any in-memory database drivers like H2 or HSQL in the classpath, then Spring Boot will automatically create an in-memory data source and will register the EntityManagerFactory and TransactionManager beans automatically with sensible defaults. But you are using MySQL, so you need to explicitly provide MySQL connection details. You have configured those MySQL connection details in the application.properties file and Spring Boot creates a DataSource using those properties.

We added spring-boot-starter-web, which pulls spring-boot-starter-tomcat automatically. When we run the main() method, it starts tomcat as an embedded container so that we don’t have to deploy our application on any externally installed tomcat server. What if we want to use a Jetty server instead of Tomcat? You simply exclude spring-boot-starter-tomcat from spring-boot-starter-web and include spring-boot- starter-jetty. That’s it.

This directory, as the name suggests, is dedicated to all the static resources, templates and property files.

• resources/static - contains static resources such as css, js and images.

• resources/templates - contains server-side templates which are rendered by Spring.

• resources/application.properties - This file is very important. It contains application-wide properties. Spring reads the properties defined in this file to configure your application. You can define a server’s default port, server’s context path, database URLs etc, in this file.

This class provides a entry point with the public static void main(String[] args) method, which you can run to start the application.

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

@SpringBootApplication
public class Springboot2WebappThymeleafApplication {

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

@SpringBootApplication is a convenience annotation that adds all of the following:

• @Configuration tags the class as a source of bean definitions for the application context.

• @EnableAutoConfiguration tells Spring Boot to start adding beans based on classpath settings, other beans, and various property settings.

• Normally you would add @EnableWebMvc for a Spring MVC app, but Spring Boot adds it automatically when it sees spring-web MVC on the classpath. This flags the application as a web application and activates key behaviors such as setting up a DispatcherServlet.

• @ComponentScan tells Spring to look for other components, configurations, and services in the hello package, allowing it to find the controllers.

The main() method uses Spring Boot’s SpringApplication.run() method to launch an application. Did you notice that there wasn’t a single line of XML? No web.xml file either. This web application is 100% pure Java and you didn’t have to deal with configuring any plumbing or infrastructure.

package net.guides.springboot2.springboot2webappthymeleaf.domain;

import javax.persistence.Entity;
import javax.persistence.GeneratedValue;
import javax.persistence.GenerationType;
import javax.persistence.Id;
import javax.persistence.Table;

@Entity
@Table(name = "user")
public class User
{
	@Id 
	@GeneratedValue(strategy=GenerationType.AUTO)
	private Integer id;
	private String name;
	
	public User()
	{
	}

	public User(Integer id, String name)
	{
		this.id = id;
		this.name = name;
	}

	public Integer getId()
	{
		return id;
	}

	public void setId(Integer id)
	{
		this.id = id;
	}

	public String getName()
	{
		return name;
	}

	public void setName(String name)
	{
		this.name = name;
	}
}

package net.guides.springboot2.springboot2webappthymeleaf.repositories;

import org.springframework.data.jpa.repository.JpaRepository;

import net.guides.springboot2.springboot2webappthymeleaf.domain.User;

public interface UserRepository extends JpaRepository<User, Integer>
{

}

package net.guides.springboot2.springboot2webappthymeleaf.controllers;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;

import net.guides.springboot2.springboot2webappthymeleaf.repositories.UserRepository;

@Controller
public class HomeController
{
	@Autowired UserRepository userRepo;
	
	@RequestMapping("/")
	public String home(Model model)
	{
		model.addAttribute("users", userRepo.findAll());
		return "index";
	}
}

Configure application.properties to connect to your MySQL database. Let's open an application.properties file and add following database configuration to it.

logging.level.org.springframework=INFO

################### DataSource Configuration ##########################
spring.datasource.driver-class-name=com.mysql.jdbc.Driver
spring.datasource.url=jdbc:mysql://localhost:3306/users_database
spring.datasource.username=root
spring.datasource.password=root

################### Hibernate Configuration ##########################

spring.jpa.hibernate.ddl-auto=update
spring.jpa.show-sql=true

Once you will run this application will create user table in database and use below insert SQL script to populate few records in user table.

INSERT INTO `users_database`.`user` (`id`, `name`) VALUES ('1', 'Salman');
INSERT INTO `users_database`.`user` (`id`, `name`) VALUES ('2', 'SRK');
INSERT INTO `users_database`.`user` (`id`, `name`) VALUES ('3', 'AMIR');
INSERT INTO `users_database`.`user` (`id`, `name`) VALUES ('4', 'Tiger');
INSERT INTO `users_database`.`user` (`id`, `name`) VALUES ('5', 'Prabhas');

Let's create a Thymeleaf view to show the list of users. Locate below index.html file under src/main/resources/templates folder of this project.

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" 
	  xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="utf-8"/>
<title>Home</title>
</head>
<body>
	<h2 th:text="#{app.title}">App Title</h2>
	<table>
		<thead>
			<tr>
				<th>Id</th>
				<th>Name</th>
			</tr>
		</thead>
		<tbody>
			<tr th:each="user : ${users}">
				<td th:text="${user.id}">Id</td>
				<td th:text="${user.name}">Name</td>
			</tr>
		</tbody>
	</table>
</body>
</html>

Now run Springboot2WebappThymeleafApplication.java as a Java application and point your browser to http://localhost:8080/. You should see the list of users in a table format.

diagram here