【極簡版】SpringBoot+SpringData JPA 管理系統

CntChen 發布于2019-08-19 11:34 / 2791人閱讀

摘要：帶你搭一個的我的目的是做一個十分簡易的管理系統，這就得有頁面，下面我繼續來講講我是怎么快速搭一個管理系統的。由于是簡易版，我的目的是能夠快速搭建，而不在于代碼的規范性。我們現在希望把記錄塞到一個管理頁面上展示起來。

前言

只有光頭才能變強。

文本已收錄至我的GitHub倉庫，歡迎Star：https://github.com/ZhongFuCheng3y/3y

在上一篇中已經講解了如何從零搭建一個SpringBoot+SpringData JPA的環境，測試接口的時候也成功獲取得到數據了。

帶你搭一個SpringBoot+SpringData JPA的Demo

我的目的是做一個十分簡易的管理系統，這就得有頁面，下面我繼續來講講我是怎么快速搭一個管理系統的。

ps:由于是簡易版，我的目的是能夠快速搭建，而不在于代碼的規范性。(所以在后面你可能會看到很多丑陋的代碼)

一、搭建管理系統 1.1. 搭建頁面

在上一篇的最后，我們可以通過http://localhost:8887/user接口拿到我們User表所有的記錄了。我們現在希望把記錄塞到一個管理頁面上(展示起來)。

作為一個后端，我HTML+CSS實在是丑陋，于是我就去找了一份BootStrap的模板。首先，我進到bootStrap的官網，找到基本模板這一塊：

我們在里邊可以看到挺多的模板的，這里選擇一個控制臺頁面：

于是，就把這份模板下載下來，在本地中運行起來試試看。官方給出的鏈接是下載整一份文檔，我們找到想要的頁面即可：

于是我們將這兩份文件多帶帶粘貼在我們的項目中，發現這HTML文件需要bootstrap.css、bootstrap.js、jquery?的依賴(原來用的是相對路徑，其實我們就是看看相對路徑的文件在我們這有沒有，如果沒有，那就是我們需要的)。這里我們在CDN中找找，導入鏈接就行了。

于是我們就將所缺的依賴替換成BootCDN的依賴，最重要的幾個依賴如下：

如無意外的話，我們也能在項目中正常打開頁面。

1.1.2 把數據塞到頁面上

把數據塞到頁面上，有兩種方案：要么就后端返回json給前端進行解析，要么就使用模板引擎。而我為了便捷，是不想寫JS代碼的。所以，我使用freemarker這個模板引擎。

為什么這么多模板引擎，我選擇這個？因為我只會這個！

在SpringBoot下使用freemarker也是非常簡單，首先，我們需要加入pom文件依賴：



  org.springframework.boot
  spring-boot-starter-freemarker

隨后，在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目錄下：

接下來將我們Controller得到的數據，塞到Model對象中：

    /**
     * 得到所有用戶
     */
    @GetMapping(value = "/user", produces = {"application/json;charset=UTF-8"})
    public String  getAllUser ( Model model) {
        List allUser = userService.getAllUser();
        model.addAttribute("users", allUser);
        return "/index";
    }

圖片如下：

在ftl文件中，我們只要判斷數據是否存在，如果存在則在表格中遍歷出數據就行了：

   <#if users?? && (users?size > 0)>
     <#list users as user>
       
         ${user.userId}
         ${user.userNickname}
         ${user.userEmail}
         ${user.actiState}
         刪除
       
       
     <#else>
       還沒有任何用戶

圖片如下：

刪除的Controller代碼如下：

/**
 * 根據ID刪除某個用戶
 */
@GetMapping(value = "/deleteUser", produces = {"application/json;charset=UTF-8"})
public String  deleteUserById (String id,Model model) {

  userService.deleteUserById(id);
  return getAllUser(model);

}

我們再找幾張自己喜歡的圖片，簡單刪除一些不必要模塊，替換成我們想要的文字，就可以得到以下的效果了：

至于圖片上的評論管理、備忘錄管理的做法都如上，我只是把文件再復制一次而已(期中沒有寫任何的JS代碼,懶)。

在編寫的期中，要值得注意的是：靜態的文件一般我們會放在static文件夾中。

項目的目錄結構如下：

最后

本文涉及到的鏈接(bootstrap & cdn)：

https://v3.bootcss.com/getting-started/#template

https://www.bootcdn.cn/all/

樂于輸出干貨的Java技術公眾號：Java3y。公眾號內有200多篇原創技術文章、海量視頻資源、精美腦圖，不妨來關注一下！

覺得我的文章寫得不錯，不妨點一下贊！

云服務器 GPU云服務器極簡版 SpringData 極簡極簡模式

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/77467.html

帶你搭一個SpringBoot+SpringData JPA的環境

摘要：一從零搭建環境本次我使用的是編輯器來搭建和環境首先，我們在新建項目的時候，選擇，然后就行了。可以看出，本次的版本為。這是一個非常好用的插件，有了它我們可以不用寫繁瑣的方法。非常適合我們做一些簡答的測試和小功能。前言只有光頭才能變強。文本已收錄至我的GitHub倉庫，歡迎Star：https://github.com/ZhongFuCheng3y/3y 不知道大家對SpringB...

i_garfileo 2019-08-16 16:04 評論0 收藏0
SpringDataJPA入門就這么簡單

摘要：一入門在上次學的時候，那時候的教程就已經涉及到了一點的知識了。入門只是中的一個子模塊是一套標準接口，而是的實現底層默認實現是使用的首個接口就是，它是一個標記接口。這也導致了我出現這個錯誤的原因。一、SpringData入門在上次學SpringBoot的時候，那時候的教程就已經涉及到了一點SpringData JPA的知識了。當時還是第一次見，覺得也沒什么大不了，就是封裝了Hiber...

MasonEast 2019-08-15 14:51 評論0 收藏0
使用SpringData+JPA的@Query注解完成動態條件分頁查詢

摘要：正文公司使用的是現在流行的，數據庫方面使用的是。這幾天用的最多的就是用進行查詢了，簡單的查詢很簡單，網上查一查就有一堆方案，直到遇到分頁查詢的時候出了問題。寫作原因之前在學校都是做前端，但是最后找了個Java后端的工作，框架什么的基本沒用過，所以工作中遇到了很多問題，所以決定記錄下來工作中遇到的問題，記錄成長的點滴。正文公司使用的是現在流行的SpringBoot，數據庫方面使用...

melody_lql 2019-08-16 18:36 評論0 收藏0
SpringBoot就是這么簡單

摘要：熱加載代表的是我們不需要重啟服務器，就能夠類檢測得到，重新生成類的字節碼文件無論是熱部署或者是熱加載都是基于類加載器來完成的。驗證階段字節碼文件不會對造成危害準備階段是會賦初始值，并不是程序中的值。一、SpringBoot入門今天在慕課網中看見了Spring Boot這么一個教程，這個Spring Boot作為JavaWeb的學習者肯定至少會聽過，但我是不知道他是什么玩意。只是大...

whinc 2019-08-15 14:52 評論0 收藏0