仿网易云的音乐播放器

前言

本次项目的开始的初衷是之前在使用js实现音频播放时就打算着手实践的,花了一些时间将该项目落地了。
本项目是仿制网易云音乐客户端版的web实现,实际上该项目只是前端项目,数据是模拟的(数据量不大)。
之所以动手该项目,实际上有如下几点:

  • 喜欢网易云音乐的客户端版的风格
  • 对于音频以及视频播放有兴趣,自己也没有做过
  • 回顾vue相关,作为开启vue相关源码学习的开端

该项目未采用任何前端框架,所涉及的技术框架:vue全家桶(vue + vuex +vue-router) + font awesome(图标)+ less

项目实现效果

项目实现效果如下图所示:

  • 发现音乐页面:

发现音乐页面

  • 私人FM页面:

私人FM页面

  • 我喜欢的音乐页面

我喜欢的音乐页面

  • 个性换肤

个性换肤

  • 左侧歌曲icon点击展开的播放页面

播放

  • 私人FM播放与切换

私人FM

结束语

上面展示的就是整体的实现部分,所有的组件的都是自己编写,例如轮播、滑动、音频、视频等。既然是一个开源项目,我想所有的东西都自己动手来实现。
代码会上传到我的GitHub,欢迎fork和star。

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值