Vue + SpringBoot實現的部落格系統
阿新 • • 發佈:2022-04-08
效果圖
首頁
登入頁
註冊頁
文章分類-標籤、詳情
文章歸檔
寫文章
文章詳情
評論
技術
前端 blog-app
- Vue
- Vue-router
- Vuex
- ElementUI
- mavon-editor
- lodash
- axios
- Webpack
後端 blog-api
- SpringBoot
- Shiro
- Jpa
- Redis
- Fastjson
- Druid
- MySQL
- Maven
實現功能
整體
- 使用者:登入 註冊 退出
- 首頁:文章列表、最熱標籤、最新文章、最熱文章
- 文章分類-標籤:列表、詳情
- 文章歸檔
- 文章:寫文章、文章詳情
- 評論:文章新增評論 對評論回覆
- 文章列表滑動分頁
後端
- 使用者、文章、文章分類、標籤和評論 增刪改查api介面
- 基於token許可權控制
- Redis儲存Session
- 全域性異常處理
- 操作日誌記錄
待實現功能
- 評論的分頁 點贊
- 留言板
- 第三方登入
- ......
執行
將專案clone到本地
方式一 直接執行SpringBoot專案(已將打包的靜態檔案放到了 resources/static下)
- 將blog-api匯入到IDE工具中
- resources/sql/blog-schema.sql、blog-data.sql匯入MySQL資料庫
- 開啟Redis資料庫
- resources/application.properties 修改MySQL、Redis連線
- Runas執行,訪問:http://localhost:8888
方式二 前後分離(開發方式)
-
按方式一執行blog-api,提供api資料介面
-
開啟命令列
cd blog-app
npm install
npm run dev
-
修改blog-app/src 下的檔案進行開發
-
npm run build 生成最終靜態檔案
獲取方式: 關注公眾號:知識追尋者: 回覆 blog98