【分享】用Vue做一个模仿网易云音乐的单页面应用
粉丝福利 : 关注VUE中文社区公众号,回复视频领取粉丝福利
说明
楼主是一名准大四生了,在暑假花了十多天做的一个单页面应用,目的是为了熟悉一下Vue.js的开发。
网易云音乐APP的功能模块非常多,目前仅仅完成了推荐歌单
,最新音乐
,排行榜
,播放器
,搜索歌曲和歌手
,歌手单曲
,查看评论
等一些基本的功能。
所有需要登录才能使用的功能目前都尚未开发。
由于获取网易云数据的方式比较特殊,有时候请求数据的时间会偏久一点(为此自己也做了缓存机制来缓解这一问题)。
第一次分享自己的小项目,还望各位大佬多多支持哈
项目地址
https://github.com/SlowSoulWen/vue-music
项目预览
手机请扫描下方二维码预览
PC端预览地址(只做了移动端适配,请将浏览器设置为手机预览模式)
前端技术栈
vue2 + vuex + vue-router + vue-awesome-swiper + axios + webpack
后端
所有数据都来自网易云音乐,API由 NeteaseCloudMusicApi 提供
自己在该项目基础上增加了IP代理及缓存机制,以防止网易封禁IP,提高请求速度及减少API的请求频率。
效果演示
安装
$ git clone git@github.com:SlowSoulWen/vue-music.git
$ npm install
运行
$ npm run dev