Spring Reactive, Thymeleaf Hello World (Spring Webflux + Thymeleaf + JS/CSS)
Spring Framework
- Profiling a Spring Boot application with Pyroscope
- Spring Boot Rest APIs with PostgreSQL (Spring Boot + Rest APIs)
- Spring's transaction management with the @Transactional annotation
- Dockerize Spring Boot app and Push image to DockerHub (Spring Boot + DockerHub)
- Spring Reactive with PostgreSQL (Spring Boot WebFlux + PostgreSQL)
- Spring Data Redis with RedisTemplate and CrudRepository
- Sending Emails in Spring Boot via SMTP
- Securing Server-to-Server Communication with "Spring Boot" & "OAuth 2"
- Spring Boot, Thymeleaf Hello World (Spring Boot + Thymeleaf + JS/CSS)
- Caching in Spring Boot (@Cacheable, @CacheEvict & @CachePut)
- Spring Boot Login/Logout (Spring Security + MySql + Thymeleaf)
Mar 31, 2024
In this article we will see how to create a "Spring Reactive (Webflux) project with "Thymeleaf", we will also see how to import "css", "js" and "images" and populate dynamic data.
1) Dependencies
Let's create a project with , make sure to add required dependencies as shown in the picture below:
The final "pom.xml" should look something like this:
2) Static Resources
We should add static resources like: "js", "css" and "images" in "src/main/resources/static" folder and "Thymeleaf(.html)" files in "src/main/resources/templates" folder as shown in the image below:
app.css
index.html
3) Controller
This is the place to define "requestMappings", please note how "Rendering" is used to send data from "Controller" to "Thymeleaf's" .html file.
4) Service
This is just an abstraction between the data layer and the controller. We are generating some fake data here to show it on the UI, but in a real scenario all the data comes from a datasource.
5) Model
This is a simple model; we used it to send "employee" data from controller layer to view layer (thymeleaf).
6) Spring Boot
This is plain old Spring Boot driver class; all the execution starts from here.
7) Testing
Now we are all done with our project setup; lets run the application and navigate to home page : http://localhost:8080
NK Chauhan
NK Chauhan is a Principal Software Engineer with one of the biggest E Commerce company in the World.
Chauhan has around 12 Yrs of experience with a focus on JVM based technologies and Big Data.
His hobbies include playing Cricket, Video Games and hanging with friends.