Getting started : SpringBoot, Thymeleaf and Bootstrap

I've been working with spring framework for many years. In the early stage, setting up a production ready application was not that easy. Specially, finding relevant dependencies was not so easy and there were a lot of configurations. But now, pain is over thanks to SpringBoot project. We can create a spring base application with minimum fuss.

Lets create a SpringBoot application with Thymeleaf and Boostrap following these steps,

STEP 01 : Generate a Maven project 

Easiest way to get started is creating a maven project using spring initializer www.start.spring.io

Enter values to group id, artifact id and dependencies (for this project we need only web and Thymeleaf dependency). Then click on Generate Project button to download the project.

STEP 02 : Import as a Existing maven project to Eclipse

If we do a closer look at the generated POM file, we can see project's parent has set to spring-boot-starter-parent and spring-boot-starter-web and pring-boot-starter-thymeleaf  have been added to the dependencies. These dependencies add required libraries to the project. For instance, spring-boot-starter-web adds spring-web dependency to the project. You can see all added dependencies by expanding Maven Dependencies node on your Eclipse project.

<?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>com.mydailyjavawork.sping</groupId>
 <artifactId>mydailyjavawork-spring</artifactId>
 <version>0.0.1-SNAPSHOT</version>
 <packaging>jar</packaging>

 <name>mydailyjavawork-spring</name>
 <description>Demo project for Spring Boot</description>

 <parent>
  <groupId>org.springframework.boot</groupId>
  <artifactId>spring-boot-starter-parent</artifactId>
  <version>1.5.2.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-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>

We will import the generated project into Eclipse. 

STEP 03 : Add Bootstrap template to the project

Static resources such as Java scripts, css and HTML files can be easily served from our spring boot application. By default Spring Boot serves static content from resources in the classpath at "/static". So, this is the place we will put files from the Bootstrap template. 

There are several free bootstrap templates available in https://startbootstrap.com website. I selected https://startbootstrap.com/template-overviews/freelancer/ template for this example. Extract downloaded template zip file and copy css, img, js and vendor folders to static folder in our project. Now our project structure look like this,

The index.html resource is special because it is used as a "welcome page" if it exists. Therefore, we do not need to specify URL mapping for index.html page

STEP 04 : Run SpringBoot application

We can start our application by running MydailyjavaworkSpringApplication.java class. 

By default, spring boot starts tomcat server on port 8080. If you want to change this port, just add server.port = <your port number> to the application.properties file.

We can access our website on http://localhost:8080 

Yes, it is that easy !!!