1200字范文,内容丰富有趣,写作的好帮手!
1200字范文 > React实现H5音乐播放器

React实现H5音乐播放器

时间:2023-12-12 11:42:55

相关推荐

React实现H5音乐播放器

React-music

React Music WebApp,在听音乐的时候忽然想听腾格尔的钢铁之翼(隐形的翅膀),在网易云上却找不到,就很气。于是想到了做一个,音乐搜索的功能,把所有想听的歌,能够一次性在酷狗、网易云、QQ、虾米等平台上找找完。本项目非常适合新手练习熟悉react全家桶,欢迎start哦。

地址(欢迎start哦~)

在线地址: /#/home

后端github地址: /Mohannnnn/react-music-koa2

前端github地址: /Mohannnnn/react-music

技术栈

React+React-router+Redux+React-redux+ES6/7+webpack4+Ant Design+Ant Motion+Fetch/Axios+Scss

目录结构

│ .babelrc #babel的规则以及插件│ .editorconfig #IDE/编辑器相关的配置│ .eslintignore #Eslint忽视的目录│ .eslintrc.js #Eslint的规则和插件│ .gitignore #Git忽视的目录│ .postcssrc.js #postcss的插件│ package-lock.json│ package.json #项目相关的包│ README.md│ yarn.lock│├─build#webpack相关的配置│utils.js #webpack配置中的通用方法│webpack.base.conf.js #webpack的基础配置│webpack.dev.conf.js #webpack的开发环境配置│webpack.prod.conf.js #webpack的生产环境配置│└─src#主目录,业务代码│ app.css│ App.js│ favicon.ico│ index.ejs│ index.js││-api#接口api等配置│-compontents #组件│-store #Redux管理目录│-utils #工具函数位置│-router #路由└─assets #静态目录,存放静态资源

V1.0实现的功能

1.推荐歌单页2.推荐歌单详情页3.热门歌曲页4.播放页5.搜索(QQ音乐、网易云、酷狗)6.音乐全局播放7.歌词同步(在播放页,点击转动的图片)8.切换上一首、下一首

V2.0实现的功能

1.添加到歌单、从歌单删除、删除全部2.歌词动画、以及每个路由下的页面出场动画3.随机播放、顺序播放4.音量控制(未做,感觉意义不大,手机能自己调)5.其他(待定功能,想到在做)

安装依赖

yarn install / npm install

启动项目

yarn dev/npm run dev

打包项目

yarn build/npm run build

demo

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。