項(xiàng)目地址
https://github.com/Yin-Hongwei/music-website
項(xiàng)目說明
本音樂網(wǎng)站的開發(fā)主要利用前端框架 Vue 開發(fā)客戶端和管理端，后端接口用 SpringBoot 來實(shí)現(xiàn)摹芙，數(shù)據(jù)持久化用的是 MyBatis洁段，數(shù)據(jù)庫使用的是 MySQL秃殉。實(shí)現(xiàn)思路可以參考這里识埋。
項(xiàng)目截圖
客戶端
管理端
功能
- WEB 端音樂播放
- 用戶登錄注冊(cè)
- 用戶信息編輯
- 歌曲免绿、歌單搜索
- 歌單打分
- 歌單唧席、歌曲評(píng)論
- 分頁顯示
- 歌詞同步顯示
- 音樂收藏、下載嘲驾、拖動(dòng)控制
- 后臺(tái)對(duì)用戶淌哟、歌曲、歌手辽故、歌單信息的管理
技術(shù)棧
后端
SpringBoot + MyBatis
前端
Vue + Vue-Router + Vuex + Axios + ElementUI
安裝
1徒仓、下載項(xiàng)目到本地
git clone https://github.com/Yin-Hongwei/music-website.git
2、下載數(shù)據(jù)庫中記錄的資源
去【鏈接: https://pan.baidu.com/s/1Qv0ohAIPeTthPK_CDwpfWg 提取碼: gwa4 】下載網(wǎng)站依賴的歌曲及圖片誊垢，將 data 夾里的文件直接放到 music-server 文件夾下掉弛。
3症见、修改
1）數(shù)據(jù)庫：將sql文件夾中的 tp_music.sql 文件導(dǎo)入數(shù)據(jù)庫。（mysql 版本不能低于5.7）
2）music-server：?jiǎn)?dòng)后端服務(wù)之前殃饿，有一些地方需要修改谋作，先去 /music-website/music-server/src/main/resources 這個(gè)目錄下的文件里修改自己的 spring.datasource.username 和 spring.datasource.password，并且修改下圈出來的的文件中 MyPicConfig 類下的 addResourceLocations方法中的路徑乎芳，否則資源加載不了遵蚜。（Mac 和 win 下路徑有些差異，我的是Mac上的路徑奈惑，win 上 需要在 file:后標(biāo)明是哪個(gè)盤吭净，例如："file:C:\\user\\XXX\\"）
4、啟動(dòng)項(xiàng)目
然后進(jìn)入 music-server 文件夾携取，運(yùn)行下面命令啟動(dòng)服務(wù)器
./mvnw spring-boot:run
進(jìn)入 music-client 文件夾攒钳，運(yùn)行下面命令啟動(dòng)前臺(tái)項(xiàng)目
npm install // 安裝依賴
npm run dev // 啟動(dòng)前臺(tái)項(xiàng)目
進(jìn)入 music-manage 文件夾，運(yùn)行下面命令啟動(dòng)后臺(tái)管理項(xiàng)目
npm install // 安裝依賴
npm run dev // 啟動(dòng)后臺(tái)管理項(xiàng)目
