vue admin blog

w-blog

描述

一個後端使用Spring Boot 2.x、前台使用nuxtJs、後台使用vue的個人博客

簡介

1. 連結

• Gitee連結：

  • api： https://gitee.com/windsnowli/w-blog-api

  • 前台： https://gitee.com/windsnowli/vue-ssr-blog

  • 後台： https://gitee.com/windsnowli/vue-admin-blog

• GitHub連結：

  • api： https://github.com/WindSnowLi/w-blog-api

  • 前台： https://github.com/WindSnowLi/vue-ssr-blog

  • 後台： https://github.com/WindSnowLi/vue-admin-blog

2. 一個簡單的個人部落格項目，共分為了前台、后台、 api三個部分。

3. api 後端基於SpringBoot 。主要依賴mybatis 、 fastjson 、 DruidDataSource 、 Lombok 、 java-jwt 、 aliyun-sdk-oss 、 knife4j等，資料庫使用的是MySQL8.0+

4. 前台前台的主要樣式是來自網路上了一個BizBlog模板，最初來自於哪我不得而知，在原本的基礎上改寫成了nuxtJs專案。

5. 後台後台UI套用的vue-element-admin，基本上是直接拿來用了，想自己定制著實實力不允許。

6. 例：綠色食品——菜狗

本地啟動

api：前台後台請求的api使用的是同一個項目

1. git clone https://gitee.com/WindSnowLi/w-blog-api.git或git clone https://github.com/WindSnowLi/w-blog-api.git克隆專案到本地
2. mvn clean install dependency:tree安裝依賴
3. 修改開發環境application-dev.yml和生產環境application-prod.yml中的資料庫設定資訊； knife4j只在開發環境中啟動。
4. 建立資料庫配置中指定名稱的空資料庫， UTF8編碼
5. mvn clean package -Dmaven.test.skip=true跳過測試並產生jar封包
6. java -jar 生成的包名.jar運行開發配置環境，初次運行會自動初始化資料庫
7. 造訪http://127.0.0.1:8888/doc.html查看api文檔
8. 推薦使用IDEA開啟專案資料夾自動處理依賴、方便執行

前台

1. git clone https://gitee.com/WindSnowLi/vue-ssr-blog.git或git clone https://github.com/WindSnowLi/vue-ssr-blog.git克隆專案到本地
2. npm install安裝依賴
3. 可修改config/sitemap.xml檔案中的host位址，用於產生存取地圖
4. 可修改nuxt.config.js中的連接埠號
5. 可修改package.json檔案中的script中的BASE_URL來指定後端api位址
6. npm run build編譯
7. npm start本地運行

後台

1. git clone https://gitee.com/WindSnowLi/vue-admin-blog.git或git clone https://github.com/WindSnowLi/vue-admin-blog.git克隆專案到本地
2. npm install安裝依賴
3. npm run dev使用模擬資料預覽介面
4. 修改.env.production檔案中的VUE_APP_BASE_API位址為後端api的位址
5. npm run build:prod編譯
6. dist資料夾下的為編譯好的文件，可放到http伺服器下（可使用npm安裝http-server ）進行訪問
7. 預設帳號: [email protected] ,密碼: 123456

介面展示

前台

後台

License

MIT

Copyright (c) 2021 WindSnowLi