在Vue+SpringBoot中如何實現部落格管理平台

V部落是一個多用戶部落格管理平台。這篇文章主要介紹了Vue SpringBoot開發V部落格管理平台,需要的朋友可以參考下

V部落是一個多用戶部落格管理平台，採用Vue SpringBoot開發。

示範網址：http://45.77.146.32:8081/index.html

專案網址: https://github.com/lenve/VBlog 

登陸頁面

文章列表

 

#發表文章

 

用戶管理

 

欄位管理

 

資料統計

 

##技術堆疊

後端技術堆疊

後端主要採用了：

1.SpringBoot

2.SpringSecurity

3.MyBatis

4.部分介面遵循Restful風格

5.MySQL

前端技術堆疊

#前端主要採用了：

1.Vue

2.axios

3.ElementUI

4.vue-echarts

5.mavon-editor

6.vue-router

還有其他一些瑣碎的技術我就不在這裡一一列舉了。 #########快速執行#########1.複製本專案到本機######git@github.com:lenve/VBlog.git###### 2.找到blogserver專案中resources目錄下的vueblog.sql文件，在MySQL資料庫執行######3.根據自己本地情況修改資料庫配置，資料庫配置在SpringBoot專案的application.properties中#### ##4.在IntelliJ IDEA中運行blogserver專案######OK，至此，服務端就啟動成功了，此時我們直接在網址列輸入http://localhost:8081/index.html 即可訪問我們的項目，如果要做二次開發，請繼續看第五、六步。 ######5.進入到vueblog目錄中，在控制台依次輸入如下命令：###

# 安装依赖
npm install
# 在 localhost:8080 启动项目
npm run dev

###由於我在vueblog項目中已經配置了端口轉發，將數據轉發到SpringBoot上，因此項目啟動之後，在瀏覽器中輸入http://localhost:8080 就可以存取我們的前端專案了，所有的請求透過連接埠轉送將資料傳到SpringBoot（注意此時不要關閉SpringBoot專案）。 ######6.最後可以用WebStorm等工具開啟vueblog項目，繼續開發，開發完成後，當項目要上線時，依然進入到vueblog目錄，然後執行如下指令：###

npm run build

###該命令執行成功之後，vueblog目錄下產生一個dist資料夾，將該資料夾中的兩個檔案static和index.html拷貝到SpringBoot專案中resources/static/目錄下，然後就可以像第4步驟一樣直接訪問了。 ######步驟5需要大家對NodeJS、NPM等有一定的使用經驗，不熟悉的小夥伴可以先自行搜尋學習下，推薦Vue 官方教學 。 ######專案依賴######1. vue-echarts######2. mavonEditor######上面是我整理給大家的，希望今後會對大家有幫助。 ######相關文章：#########vue vuex vue-rouert 權限路由（詳細教學）############在Angular中如何實作orderBy排序與模糊查詢############在Angular中如何實作敏感文字提示#############在Angular中如何實作隱藏顯示######

以上是在Vue+SpringBoot中如何實現部落格管理平台的詳細內容。更多資訊請關注PHP中文網其他相關文章！