【极简版】SpringBoot+SpringData JPA 管理系统

简介: 我的目的是做一个十分简易的管理系统,这就得有页面,下面我继续来讲讲我是怎么快速搭一个管理系统的。

一、搭建管理系统


1.1. 搭建页面


在上一篇的最后,我们可以通过http://localhost:8887/user接口拿到我们User表所有的记录了。我们现在希望把记录塞到一个管理页面上(展示起来)。

作为一个后端,我HTML+CSS实在是丑陋,于是我就去找了一份BootStrap的模板。首先,我进到bootStrap的官网,找到基本模板这一块:

9.jpg

我们在里边可以看到挺多的模板的,这里选择一个控制台页面:

8.jpg

于是,就把这份模板下载下来,在本地中运行起来试试看。官方给出的链接是下载整一份文档,我们找到想要的页面即可:

7.jpg

于是我们将这两份文件单独粘贴在我们的项目中,发现这HTML文件需要bootstrap.css、bootstrap.js、jquery的依赖(原来用的是相对路径,其实我们就是看看相对路径的文件在我们这有没有,如果没有,那就是我们需要的)。这里我们在CDN中找找,导入链接就行了。

6.jpg

于是我们就将所缺的依赖替换成BootCDN的依赖,最重要的几个依赖如下:

<link href="https://cdn.bootcss.com/twitter-bootstrap/3.4.0/css/bootstrap.min.css" rel="stylesheet">
<script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script>
<script src="https://cdn.bootcss.com/twitter-bootstrap/3.4.1/js/bootstrap.min.js"></script>

如无意外的话,我们也能在项目中正常打开页面。


1.1.2 把数据塞到页面上


把数据塞到页面上,有两种方案:要么就后端返回json给前端进行解析,要么就使用模板引擎。而我为了便捷,是不想写JS代码的。所以,我使用freemarker这个模板引擎。

  • 为什么这么多模板引擎,我选择这个?因为我只会这个!

在SpringBoot下使用freemarker也是非常简单,首先,我们需要加入pom文件依赖:

<!--freemarker-->
<dependency>
  <groupId>org.springframework.boot</groupId>
  <artifactId>spring-boot-starter-freemarker</artifactId>
</dependency>

随后,在application.yml文件中,加入freemarker的配置:

# freemarker配置
  freemarker:
    suffix: .ftl
    request-context-attribute: request
    expose-session-attributes: true
    content-type: text/html
    check-template-location: true
    charset: UTF-8
    cache: false
    template-loader-path: classpath:/templates

这里我简单解释一下:freemarker的文件后缀名为.ftl,程序从/templates路径下加载我们的文件。

于是乎,我将本来是.html的文件修改成.ftl文件,并放在templates目录下:

5.jpg

接下来将我们Controller得到的数据,塞到Model对象中:

/**
     * 得到所有用户。
     */
@GetMapping(value = "/comment", produces = {"application/json;charset=UTF-8"})
public String  getAllComment (Model model) {
  List<Comment> allComment = commentService.getAllComment();
  model.addAttribute("comments", allComment);
  return "/comment";
}

图片如下:代码有误以图片为准

4.jpg

在ftl文件中,我们只要判断数据是否存在,如果存在则在表格中遍历出数据就行了:

<#if users?? && (users?size > 0)>
     <#list users as user>
       <tr>
         <td>${user.userId}</td>
         <td>${user.userNickname}</td>
         <td>${user.userEmail}</td>
         <td>${user.actiState}</td>
         <td><a href="http://localhost:8887/deleteUser?id=${user.userId}">删除</a></td>
       </tr>
       </#list>
     <#else>
       <h3>还没有任何用户</h3>
   </#if>

图片如下:

3.jpg

删除的Controller代码如下:

/**
 * 根据ID删除某个用户
 */
@GetMapping(value = "/deleteUser", produces = {"application/json;charset=UTF-8"})
public String  deleteUserById (String id,Model model) {
  userService.deleteUserById(id);
  return getAllUser(model);
}

我们再找几张自己喜欢的图片,简单删除一些不必要模块,替换成我们想要的文字,就可以得到以下的效果了:

2.jpg

至于图片上的评论管理、备忘录管理的做法都如上,我只是把文件再复制一次而已(期中没有写任何的JS代码,懒)。

在编写的期中,要值得注意的是:静态的文件一般我们会放在static文件夹中。

项目的目录结构如下:

1.jpg

相关实践学习
Serverless极速搭建Hexo博客
本场景介绍如何使用阿里云函数计算服务命令行工具快速搭建一个Hexo博客。
目录
相关文章
|
20天前
|
XML Java 数据库连接
SpringBoot集成Flowable:打造强大的工作流管理系统
在企业级应用开发中,工作流管理是一个核心组件,它能够帮助我们定义、执行和管理业务流程。Flowable是一个开源的工作流和业务流程管理(BPM)平台,它提供了强大的工作流引擎和建模工具。结合SpringBoot,我们可以快速构建一个高效、灵活的工作流管理系统。本文将探讨如何将Flowable集成到SpringBoot应用中,并展示其强大的功能。
68 1
|
29天前
|
JavaScript Java 项目管理
Java毕设学习 基于SpringBoot + Vue 的医院管理系统 持续给大家寻找Java毕设学习项目(附源码)
基于SpringBoot + Vue的医院管理系统,涵盖医院、患者、挂号、药物、检查、病床、排班管理和数据分析等功能。开发工具为IDEA和HBuilder X,环境需配置jdk8、Node.js14、MySQL8。文末提供源码下载链接。
|
2月前
|
存储 安全 Java
打造智能合同管理系统:SpringBoot与电子签章的完美融合
【10月更文挑战第7天】 在数字化转型的浪潮中,电子合同管理系统因其高效、环保和安全的特点,正逐渐成为企业合同管理的新宠。本文将分享如何利用SpringBoot框架实现一个集电子文件签字与合同管理于一体的智能系统,探索技术如何助力合同管理的现代化。
70 4
|
2月前
|
前端开发 Java Apache
SpringBoot实现电子文件签字+合同系统!
【10月更文挑战第15天】 在现代企业运营中,合同管理和电子文件签字成为了日常活动中不可或缺的一部分。随着技术的发展,电子合同系统因其高效性、安全性和环保性,逐渐取代了传统的纸质合同。本文将详细介绍如何使用SpringBoot框架实现一个电子文件签字和合同管理系统。
77 1
|
2月前
|
文字识别 安全 Java
SpringBoot3.x和OCR构建车牌识别系统
本文介绍了一个基于Java SpringBoot3.x框架的车牌识别系统,详细阐述了系统的设计目标、需求分析及其实现过程。利用Tesseract OCR库和OpenCV库,实现了车牌图片的识别与处理,确保系统的高准确性和稳定性。文中还提供了具体的代码示例,展示了如何构建和优化车牌识别服务,以及如何处理特殊和异常车牌。通过实际应用案例,帮助读者理解和应用这一解决方案。
|
25天前
|
JavaScript NoSQL Java
CC-ADMIN后台简介一个基于 Spring Boot 2.1.3 、SpringBootMybatis plus、JWT、Shiro、Redis、Vue quasar 的前后端分离的后台管理系统
CC-ADMIN后台简介一个基于 Spring Boot 2.1.3 、SpringBootMybatis plus、JWT、Shiro、Redis、Vue quasar 的前后端分离的后台管理系统
35 0
|
2月前
|
SQL Java 关系型数据库
Springboot引入jpa来管理数据库
Springboot引入jpa来管理数据库
42 0
Springboot引入jpa来管理数据库
|
2月前
|
机器学习/深度学习 移动开发 自然语言处理
基于人工智能技术的智能导诊系统源码,SpringBoot作为后端服务的框架,提供快速开发,自动配置和生产级特性
当身体不适却不知该挂哪个科室时,智能导诊系统应运而生。患者只需选择不适部位和症状,系统即可迅速推荐正确科室,避免排错队浪费时间。该系统基于SpringBoot、Redis、MyBatis Plus等技术架构,支持多渠道接入,具备自然语言理解和多输入方式,确保高效精准的导诊体验。无论是线上医疗平台还是大型医院,智能导诊系统均能有效优化就诊流程。
|
2月前
|
SQL Java 数据库连接
springBoot+Jpa(hibernate)数据库基本操作
springBoot+Jpa(hibernate)数据库基本操作
44 0
|
SQL Java
SpringBoot整合JPA(六)下
SpringBoot整合JPA(六)
170 0
SpringBoot整合JPA(六)下