Hướng dẫn sử dụng Thymeleaf trong Spring Boot
Trong bài hướng dẫn sử dụng Thymeleaf trong Spring Boot, chúng tôi sẽ hướng dẫn các bạn cách phát triển ứng dụng web với 4 tính năng cơ bản là xem, thêm, xóa và cập nhật dữ liệu. Hay còn lại là CRUD web application.
Chúng ta sẽ làm những gì trong bài hướng dẫn sử dụng Thymeleaf trong Spring Boot? Chúng ta sẽ tạo một ứng dụng web thực hiện thêm sinh viên, hiển thị danh sách sinh viên, cập nhật thông tin sinh viên và xóa sinh viên.
Giao diện ứng dụng sau khi phát triển
Hướng dẫn sử dụng Thymeleaf trong Spring Boot – Công cụ và công nghệ sử dụng
Để hoàn thành được bài hướng dẫn này, chúng ta cần chuẩn bị môi trường lập trình và công nghệ sử dụng. Cụ thể như sau:
- Spring Boot phiên bản 2.3.4.RELEASE
- Spring Data JPA phiên bản 2.3.4.RELEASE
- Hibernate phiên bản 5.4.21.Final
- Thymeleaf phiên bản 3.0.11 RELEASE
- MySQL phiên bản 8.0.21
- eclipse phiên bản 2020-09
Ngoài ra để làm tốt và thực sự hiểu bài hướng dẫn này các bạn phải có nền tảng về Java, HTML, CSS, JavaScript, Bootstrap và database.
Hướng dẫn sử dụng Thymeleaf trong Spring Boot – Các bước thực hiện
- Tạo dự án Spring Boot
- Tạo các Entity
- Tạo các Repository
- Tạo các Service
- Tạo các Controller
- Tạo các View
- Run ứng dụng
- Demo
Hướng dẫn sử dụng Thymeleaf trong Spring Boot – Tạo dự án Spring Boot
Có nhiều cách để tạo một dự án Spring Boot. Trong hướng dẫn này, chúng tôi sử dụng các bước sau:
1. Tạo dự án Spring Boot sử dụng Spirng Initializer
- Các bạn truy cập https://start.spring.io/
- Nhập thông tin Group, Artifact và chọn dependencies
- Chọn Generate để tải file dự án về máy
2. Giải nén file vừa tải về và import vào eclipse
Sử dụng eclipse -> chọn File -> chọn Open Projects from File System… -> chọn Directory… -> chỉ định thư mục chứa file đã giải nén -> chọn project -> chọn Select Folder
Chọn Finish -> Máy của các bạn phải kết nối internet để eclipse tải các dependencies về máy. Việc này có thể mất vài phút hoặc lâu hơn tùy thuộc vào tốc độ internet của các bạn. Hình bên dưới là kết quả sau khi đã import và build thành công
Hướng dẫn sử dụng Thymeleaf trong Spring Boot – Tạo Entity
Mỗi entity tương ứng với mỗi table trong database. Trong hướng dẫn này chúng ta sẽ quản lý user. Và mỗi user có id, name, email và phone. Do đó, chúng ta sẽ tạo một Java class với annotation là @Entity
Chúng tôi sẽ tạo một Java class trong vn.giasutinhoc.thymeleaf.demo.entities và đặt tên là User
Nhập code cho User
Hướng dẫn sử dụng Thymeleaf trong Spring Boot – Tạo Repository
Spring Data JPA cho phép chúng ta cài đặt các tính năng CRUD một cách dễ dàng. Chúng ta sẽ tạo một Java interface trong vn.giasutinhoc.thymeleaf.demo.repositories và đặt tên UserRepository
Nhập code cho UserRepository và lưu ý thêm @Repository tại dòng 11
Hướng dẫn sử dụng Thymeleaf trong Spring Boot – Tạo Service
Tiếp theo chúng ta tạo một Java class trong vn.giasutinhoc.thymeleaf.demo.services và đặt tên UserService
Nhập code cho UserService và lưu ý thêm @Service tại dòng 12
Hướng dẫn sử dụng Thymeleaf trong Spring Boot – Tạo Controller
Controller cho nhiệm vụ xử lý yêu cầu từ người dùng và trả về xử lý tương ứng cho người dùng. Để tạo một Controller, chúng ta tạo một Java class và sử dụng @Controller
Chúng ta tạo một Java class trong vn.giasutinhoc.thymeleaf.demo.controller và đặt tên UserController
Nhập code cho UserController
Hướng dẫn sử dụng Thymeleaf trong Spring Boot – Tạo View
1/ Tạo tập tin index.html trong thư mục templates bằng cách chuột phải lên templates -> chọn New -> chọn HTML file và nhập code cho index.html như sau
2/ Tạo tiếp tập tin addUser.html cũng trong thư mục templates để thực hiện chức năng thêm mới user
3/ Tạo tập tin khác tên editUser.html trong thư mục templates để thực hiện chức năng thay đổi thông tin user
4/ Tạo tập tin find.html trong thư mục templates để thực hiện chức năng tìm kiếm user
Hướng dẫn sử dụng Thymeleaf trong Spring Boot – Một số thao tác khác
1/ Chuẩn bị tập tin bootstrap.min.css
- Tập tin này chính là bootstrap được sử dụng trong các tập tin html.
- Các bạn truy cập https://getbootstrap.com/ -> chọn version mình muốn và tải về máy
- Giải nén, copy và paste vào thư mục static trong project
2/ Nhập code cho tập tin application.properties
Một số lưu ý khi đọc hiểu application.properties
- Dòng 1: thymeleaf là tên cơ sở dữ liệu
- Dong 2: root là username
- Dong 3: root là password
Những thông tin này các bạn thay đổi cho phù hợp với máy tính của các bạn
3/ Project sau khi thực hiện các bước trên
Hướng dẫn sử dụng Thymeleaf trong Spring Boot – Build, run và demo
1/ Build: Chuột phải project (thymeleaft.demo) -> chọn Maven -> chọn Update Project…
2/ Run: Chuột phải Application.java -> chọn Run As -> Java Application
3/ Demo
- Mở trình duyệt và nhập http://localhost:8080
- Thêm mới một người dùng: Chọn vào Add User -> nhập đầy đủ thông tin -> chọn Save
Thêm mới thành công
- Cập nhật thông tin người dùng: Chọn Edit -> nhập thông tin muốn thay đổi -> chọn Save
Cập nhật thành công
- Xóa một người dùng: Chọn Delete tại dòng muốn xóa
Hướng dẫn sử dụng Thymeleaf trong Spring Boot – Tổng kết
Xây dựng một website sử dụng công nghệ Java, các bạn có thể sử dụng thuần JSP/Servet. Ngoài ra chúng ta có thể sử dụng các framework để xây dựng một website. Một trong số đó là Spring Boot mà chúng tôi đã hướng dẫn các bạn trong bài hướng dẫn này.
Bên cạnh Spring Boot, các bạn có thể nghe nói đên Spring MVC. Chúng tôi đã biên soạn những bài hướng dẫn thuộc chủ đề Spring Framework. Mời các bạn xem thêm để có cái nhìn tổng quát hơn khi làm web bằng Java.