VBox 一款基于vue开发的音乐盒 序章
己基于vue写了一个 Mplayer,
github地址:https://github.com/xiangwenhu/MPlaer,
演示地址:http://babydairy2017.cloudapp.net:3000/index#/index
只有简单的搜索播放随心听功能,样式适配上也很差, 路由就两个,数据都走vuex,数据转发是用nodejs自己转发,而且只是PC能比较好的展现,之后不了了之,偶尔也自己上来听听歌曲。
有一天,抬头看,有一片云,特别的蓝,风一吹,一阵花香飘来,美好,美好的东西都是慢慢积累出来的。
于是开始基于vue重写Mplayer,重命名为VBox。Github地址:https://github.com/xiangwenhu/vbox
功能参考:https://y.qq.com/ ,
基本功能:
首页,
歌手,
专辑,
排行榜,
歌单,
MV,
搜索,
分享,
设置
其他功能:
响应式布局- 基于rem
延伸功能:
零张图片 - 程序上零图片,css话或者canvas绘画
版本更新- 基于 Service Worker
资源预测 - 基于 Web Worker/prefetch ,比如检查到时wifi后,打开首页后,Web Worker 自动去拉取其他功能第一屏幕的数据, 某个功能展现后,预拉取第二页的数据
离线播放-基于 FileSystem&IndexedDB, 基于FileSystem 的大文件离线存储已经实现一个基本版本,地址:https://github.com/xiangwenhu/BlogCodes/tree/master/client/FileSystem
自我录制- 基于 MediaRecorder
在线分享- 基于 Web RTC
失焦即停 - 基于 Page Visibility,可以在设置里面设置。
QQ/微信登陆 - 真的一样,酷啊(难度不小哈)
这些看起来挺多,也有一定的难度,知难而行,喜欢就好。
写下这么多,一方面是鼓励自己加油,一方面是告诫自己,路很长,加油。
现在基本功能开发了一些,给几张截图安慰一下自己。




VBox 一款基于vue开发的音乐盒 序章的更多相关文章
- 从开发一款基于Vue技术栈的全栈热重载生产环境脚手架,我学到了什么
浏览文章前 这一期,我分享给大家三点看源码的小技巧,这也是从别的大佬那总结的. 被反复使用的代码 这样的代码是一个软件的重点函数,一个大神的写法有很多精华值得学习. 穿越时间的代码 如果一段代码10年 ...
- Xsoup 是一款基于 Jsoup 开发的
Xsoup 是一款基于Jsoup 开发的,使用XPath抽取Html元素的工具.它被用于作者的爬虫框架 WebMagic 中,进行XPath 解析和抽取. 此次更新主要增加了一些XPath语法的支持. ...
- 一款基于Netty开发的WebSocket服务器
代码地址如下:http://www.demodashi.com/demo/13577.html 一款基于Netty开发的WebSocket服务器 这是一款基于Netty框架开发的服务端,通信协议为We ...
- 基于Vue开发的tab切换组件
github地址:https://github.com/MengFangui/VueTabSwitch 1.index.html <!DOCTYPE html> <html lang ...
- 基于Vue开发的门户网站展示和后台数据管理系统
基于Vue的前端框架有很多,这几年随着前端技术的官方应用,总有是学不完的前端知识在等着我们,一个人的精力也是有限,不可能一一掌握,不过我们学习很大程度都会靠兴趣驱动,或者目标导向,最终是可以以点破面, ...
- 【全面解禁!真正的Expression Blend实战开发技巧】序章
原文:[全面解禁!真正的Expression Blend实战开发技巧]序章 从silverlight2开始我也和大家一样一直在跟随微软的脚步,从sl2~sl4一步一步过来,总结了不少心得体会.由于各种 ...
- 基于VUE开发项目
前言 最近由于公司需要,需要写一个相对来说比较大型的后台管理系统.为了保证管理系统操作体验较为舒适并且项目后期益于维护,最后决定基于VUE全家桶来开发一个高度组件化的单页SPA应用. 技术选型 vue ...
- 一款基于Vue的扩展性组件库 VV-UI
github: https://github.com/VV-UI/VV-UI 演示地址: https://vv-ui.github.io/VV-UI/#/meta-info 1. LoadingBar ...
- 推荐几款基于vue的使用插件
1.muse-ui ★6042 - 三端样式一致的响应式 UI 库 2.vuetify ★11169 - 为移动而生的Vue JS 2组件框架 3.Vux ★12969- 基于Vue和WeUI的组件库 ...
随机推荐
- java web 学习笔记 jsp内置对象
jsp2 表达式语言的内置对象 使用方式${object.attributename} 或者${object["attributename"]} pageContext pageS ...
- day7、用户登陆出现-bash-4.1$错误的原因
有时候在使用用户登陆Linux系统时会出现-bash-4.1$错误,不显示用户名,路径信息. 原因:用户家目录里面与环境变量有关的文件被删除所导致的 .bash_profile .bashrc 这两个 ...
- [Python学习] 简单网络爬虫抓取博客文章及思想介绍
前面一直强调Python运用到网络爬虫方面很有效,这篇文章也是结合学习的Python视频知识及我研究生数据挖掘方向的知识.从而简介下Python是怎样爬去网络数据的,文章知识很easy ...
- cocos2dx中关于Action动作的相关API的具体介绍
//CCMoveBy 创建一个移动的动作 //參数1:移动到目标坐标所需的时间 //參数2:目标坐标 //支持reverse 能够获取其反向动作 //CCMoveTo 一样的 //CCAct ...
- Shiro学习之身份验证
身份验证,即在应用中谁能证明他就是他本人.一般提供如他们的身份ID一些标识信息来表明他就是他本人,如提供身份证,用户名/密码来证明. 在shiro中,用户需要提供principals (身份)和cre ...
- python文件操作及os模块常用命令
1.文件打开 文件句柄 = open('文件路径', '模式') 2.文件操作 打开文件时,需要指定文件路径和以何等方式打开文件,打开后,即可获取该文件句柄,日后通过此文件句柄对该文件操作. 三种基本 ...
- Hibernate学习---用Session实现CURD
我们使用Hibernate的目的是什么?对数据库进行操作,所有接下来我们就用Hibernate来进行CURD. 前边我们已经分析过了Configuration,SessionFactory和Sessi ...
- iOS UICollectionView(转二)
UICollectionView的布局是可以自己定义的,在这篇博客中先在上篇博客的基础上进行扩充,我们先使用UICollectionViewFlowLayout,然后好好的介绍一下UICollecti ...
- ABP .Net Core Entity Framework迁移使用MySql数据库
一.迁移说明 ABP模板项目Entity Framework Core默认使用的是Sql Server,也很容易将数据库迁移到MySQL,步骤如下. 二.迁移MySQL步骤 1. 下载项目 请到 ht ...
- JSP和JavaBean总结
JSP JSP全名为Java Server Pages,即java服务器页面,其根本是一个简化的Servlet设计.它是在传统的网页HTML文件中插入Java代码,从而形成JSP文件. JSP注释分为 ...