摘要:本来没打算写网易云音乐的,好像都已经被大家写烂了,不过没办法,暂时想不到其他的可写,加上网易云音乐又有,还可以基于做一层的处理再提供给前端调用,然后才决定用写了这个仿版网易云音乐技术栈实现的功能发现页我的电台页侧边栏歌单内页电台内
react-music
本来没打算写网易云音乐的,好像都已经被大家写烂了,不过没办法,暂时想不到其他的可写,加上网易云音乐又有API,还可以基于restful API做一层graphql的处理再提供给前端调用,然后才决定用react写了这个仿app版网易云音乐
技术栈react
react-router
redux
react-redux
react-motion
better-scroll
ES6/7
stylus
koa
graphql
实现的功能发现页
我的
电台页
侧边栏
歌单内页
电台内页
搜索页及结果页
上一首
下一首
播放模式切换
歌曲删除
歌词
左右滑切歌
运行git clone git@github.com:Binaryify/NeteaseCloudMusicApi.git
这是网易云API,因为最新的banner数据已经改了,可以git reset --hard d155a1fc0177e525cb650d239b8a98a8549a85e1回退到这次提交
cross-env PORT=8080 npm start
首先启动api服务器,需要用8080端口启动
git clone git@github.com:Kim09AI/react-music.git # dev模式 # 先启动graphql服务器 $ cd server && npm run dev # 再回到根目录 $ npm start # production模式 # 首次build前先执行(因为使用了dll) $ npm run build:dll $ npm run build # 本地以production模式启动服务器 cd server && npm start预览
线上地址
github地址
移动端预览
主要还是在react-redux的使用了,数据应该保存在state还是全局的store,主要还是看数据需不需要共享,或者是需不需要缓存,不然存在store反而会使问题变得更麻烦
最后感谢Binaryify提供的NeteaseCloudMusicApi
欢迎star或fork,有问题或有发现bug页欢迎提issues,写的不好的地方也请大佬指点
文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。
转载请注明本文地址:https://www.ucloud.cn/yun/95279.html
摘要:比如安卓平台在中不能触屏手动滚动。主要的功能界面模块大部分主要是展示的,网易云的页面和功能实在是太多了,由于时间关系,并没有把所有的功能都做完整,后续会陆续加上其他的功能。各部分模块首页展示音乐播放,包括动画,歌词同步等。 React Native 模仿网易云音乐手机客户端,兼容安卓和IOS两个平台。 GitHub 完整源码地址https://github.com/yezihaohao...
阅读 863·2023-04-26 03:03
阅读 2175·2021-10-12 10:12
阅读 1153·2021-09-24 09:48
阅读 1610·2021-09-22 15:25
阅读 3291·2021-09-22 15:15
阅读 893·2019-08-29 16:21
阅读 1024·2019-08-28 18:00
阅读 3405·2019-08-26 13:44