摘要：本來沒打算寫網(wǎng)易云音樂的，好像都已經(jīng)被大家寫爛了，不過沒辦法，暫時(shí)想不到其他的可寫，加上網(wǎng)易云音樂又有，還可以基于做一層的處理再提供給前端調(diào)用，然后才決定用寫了這個(gè)仿版網(wǎng)易云音樂技術(shù)棧實(shí)現(xiàn)的功能發(fā)現(xiàn)頁我的電臺(tái)頁側(cè)邊欄歌單內(nèi)頁電臺(tái)內(nèi)

本來沒打算寫網(wǎng)易云音樂的，好像都已經(jīng)被大家寫爛了，不過沒辦法，暫時(shí)想不到其他的可寫，加上網(wǎng)易云音樂又有API，還可以基于restful API做一層graphql的處理再提供給前端調(diào)用，然后才決定用react寫了這個(gè)仿app版網(wǎng)易云音樂

react

react-router

redux

react-redux

react-motion

better-scroll

ES6/7

stylus

koa

graphql

發(fā)現(xiàn)頁

我的

電臺(tái)頁

側(cè)邊欄

歌單內(nèi)頁

電臺(tái)內(nèi)頁

搜索頁及結(jié)果頁

上一首

下一首

播放模式切換

歌曲刪除

歌詞

左右滑切歌

git clone git@github.com:Binaryify/NeteaseCloudMusicApi.git

這是網(wǎng)易云API，因?yàn)樽钚碌腷anner數(shù)據(jù)已經(jīng)改了，可以git reset --hard d155a1fc0177e525cb650d239b8a98a8549a85e1回退到這次提交

cross-env PORT=8080 npm start

首先啟動(dòng)api服務(wù)器，需要用8080端口啟動(dòng)

git clone git@github.com:Kim09AI/react-music.git

# dev模式
# 先啟動(dòng)graphql服務(wù)器
$ cd server && npm run dev
# 再回到根目錄
$ npm start

# production模式
# 首次build前先執(zhí)行(因?yàn)槭褂昧薲ll)
$ npm run build:dll
$ npm run build
# 本地以production模式啟動(dòng)服務(wù)器
cd server && npm start

線上地址
github地址
移動(dòng)端預(yù)覽

主要還是在react-redux的使用了，數(shù)據(jù)應(yīng)該保存在state還是全局的store，主要還是看數(shù)據(jù)需不需要共享，或者是需不需要緩存，不然存在store反而會(huì)使問題變得更麻煩

感謝Binaryify提供的NeteaseCloudMusicApi
歡迎star或fork，有問題或有發(fā)現(xiàn)bug頁歡迎提issues，寫的不好的地方也請(qǐng)大佬指點(diǎn)