V部落博客管理平臺開源啦! Vue+SpringBoot強強聯合！

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、六步。

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

License

MIT

歡迎小夥伴們star、fork。

關注公衆號查看更多全棧資料：