技术栈
用户端: Vue(2.5) + Vuex + axios + vant + sass 等
服务端:koa2 + superagent + cheerio 等 (框架部分没用 express 而选用 koa 也是为了练习,关于两者的优劣,理解还不够深入...)
开发目的
用于个人练手,开发周期比较长,属于有空就做一点,参照网易云移动端ios版本,开发中尽量去还原ios版本中的交互效果。页面逻辑中没有太多路由,以store去控制组件的挂载、销毁
服务端部分借鉴了非常出名的 NeteaseCloudMusicApi,原本是想用node从网易云pc端扒数据下来,用于前端的调用,也实现了歌单列表、歌单详情等接口,后来发现有现成的url可以用,就放弃了,整个服务端项目写的比较随意,待优化的内容还很多
项目地址
nekomusic,欢迎star
项目结构

项目预览(部分交互)
歌单

换肤

个人中心还未完成,所以换肤按钮暂时丢在主页。通过 sass 的混入 + store 实现,并保存在 storage 中
播放、切歌

其中播放为全局组件,并注册为插件可全局调用,并支持后台播放
播放组件及歌单里的背景用到的是高斯模糊算法,引用库 StackBlur
歌词

未实现的功能是自动滚动,待完善
显示评论

歌词数据采用了分页,上拉加载用到 vant 中的 list组件
写在后面
该项目未完成和待优化的部分还有很多,我会持续更新,欢迎issues欢迎star