Spring Boot + Vue 音樂(lè)網(wǎng)站開(kāi)源項(xiàng)目，前后端分離，拿來(lái)練手真不錯(cuò)！

項(xiàng)目說(shuō)明

本音樂(lè)網(wǎng)站的客戶端和管理端使用?VUE?框架來(lái)實(shí)現(xiàn)，服務(wù)端使用?Spring Boot + MyBatis?來(lái)實(shí)現(xiàn)，數(shù)據(jù)庫(kù)使用了?MySQL。

項(xiàng)目功能

• 音樂(lè)播放
• 用戶登錄注冊(cè)
• 用戶信息編輯、頭像修改
• 歌曲、歌單搜索
• 歌單打分
• 歌單、歌曲評(píng)論
• 歌單列表、歌手列表分頁(yè)顯示
• 歌詞同步顯示
• 音樂(lè)收藏、下載、拖動(dòng)控制、音量控制
• 后臺(tái)對(duì)用戶、歌曲、歌手、歌單信息的管理

技術(shù)棧

后端

SpringBoot + MyBatis

前端

Vue + Vue-Router + Vuex + Axios + ?ElementUI

開(kāi)發(fā)環(huán)境

JDK：jdk-8u141

mysql：mysql-5.7.21-1-macos10.13-x86_64

node：v12.4.0

IDE：IntelliJ IDEA 2018、VSCode

下載運(yùn)行

1、下載源碼及資源文件

長(zhǎng)安關(guān)注下方公眾號(hào)，回復(fù)?0?即可免費(fèi)領(lǐng)取。

下載后的資源包如下所示：

2、下載數(shù)據(jù)庫(kù)中記錄的資源

將上一步下載好的的歌曲及圖片，將 data 夾里的文件按照下面的截圖存放。

3、修改配置文件

1）創(chuàng)建數(shù)據(jù)庫(kù) 將?music-website/music-server/sql?文件夾中的?tp_music.sql?文件導(dǎo)入數(shù)據(jù)庫(kù)。

2）修改用戶名密碼 修改?music-website/music-server/src/main/resources/application.properties?文件里的?spring.datasource.username?和?spring.datasource.password；

3）修改資源路徑

修改?music-server/src/main/java/com/example/yin/constant/Constants.java?文件中的?RESOURCE_PATH，否則資源加載不了。

4、啟動(dòng)項(xiàng)目

• 啟動(dòng) music-server

• 啟動(dòng) music-manage

• 啟動(dòng)客戶端：進(jìn)入 music-client 目錄，運(yùn)行下面命令

npm?install?//?安裝依賴

npm?run?dev?//?啟動(dòng)前臺(tái)項(xiàng)目

項(xiàng)目預(yù)覽

前臺(tái)截圖預(yù)覽

長(zhǎng)按關(guān)注下方公眾號(hào)，回復(fù)?0?即可免費(fèi)領(lǐng)取。

后臺(tái)截圖預(yù)覽

▲點(diǎn)擊關(guān)注全棧架構(gòu)社區(qū)公眾號(hào)▲
▲在上面公眾號(hào)回復(fù)「0」▲
注意：不是在本公眾號(hào)回復(fù)