Spring Boot 2 MVC Web Application Thymeleaf JPA MySQL Example

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.

Table of Contents

  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
  13. Source Code on Github

1. What we’ll build

We are building a simple Spring MVC web application using Thymeleaf as a view.
Output:  HTML page using Thymeleaf which displays a list of users from MySQL database.

2. Tools and Technologies Used

  • 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
  • MySQL - 5.1.46

3. Creating and Importing a Project

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.

4. Packaging Structure

Once we have imported spring boot project in IDE, we will see some auto-generated files.
  1. pom.xml
  2. resources
  3. Springboot2WebappThymeleafApplication.java
  4. Springboot2WebappThymeleafApplicationTests.java

The pom.xml File

<?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.

Spring Boot Maven plugin

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.

spring-boot-starter-parent

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

Easy Dependency Management

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.

Autoconfiguration

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.

Embedded Servlet Container Support

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.

4.2. resources/

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.

5. The Springboot2WebappThymeleafApplication.java File

This class provides an 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-webmvc 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.

6. Create a JPA Entity called User.java

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;
    }
}

7. Create Spring Data JPA Repository - UserRepository.java

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>
{

}

8. Create Spring Controller - HomeController.java

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";
    }
}

9. Configuring MySQL Database

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
Spring boot 2.0.4 RELEASE internally uses below MySQL version in pom.xml:
 <mssql-jdbc.version>6.2.2.jre8</mssql-jdbc.version>
 <mysql.version>5.1.46</mysql.version>

10. Insert SQL Script

Once you will run this application will create users table in a database and use below insert SQL script to populate a few records in a users 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');

11. Create a Thymeleaf View - index.html

Let's create a Thymeleaf view to show the list of users. Locate 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>

12. Running the Application

Now run Springboot2WebappThymeleafApplication.java as a Java application and point your browser to http://localhost:8080/
You will see below HTML page on the screen:

12. Source code on GitHub

The source code of this tutorial is available on my GitHub Repository.



Comments

  1. you didnt mention about db details...
    which version of my sql is used...

    ReplyDelete
    Replies
    1. Hi, I updated MySQL version in tools and technologies used section. Spring boot starter parent provides default property for MySQL version that is 5.1.46

      Delete
    2. spring.datasource.url=jdbc:mysql://localhost:3306/users_database?autoReconnect=true&useSSL=false

      if its not mention autoReconnect=true&useSSL=false it shown as warm error message....

      what is autoReconnect=true&useSSL=false ? can you explain about this?

      Delete

Post a Comment