【开源力荐】一款基于web的可视化视频剪辑工具
嗨, 各人好, 我是徐小夕.之前一直在社区分享零代码&低代码的技能实践,也陆陆续续筹划并开发了多款可视化搭建产品,比如:
[*]H5-Dooring(页面可视化搭建平台)
[*]V6.Dooring(可视化大屏搭建平台)
[*]橙子试卷(表单搭建引擎)
[*]Nocode/WEP 文档知识引擎
最近在研究可视化技能的时候, 又发现一款非常神奇的开源项目, 它是一款基于 web 的视频可视化剪辑工具, 我们可以利用它轻松实现本身的 web 视频编辑器, 而且代码采用vue3 实现, 非常符合各人的口味.
https://i-blog.csdnimg.cn/blog_migrate/0e386fca74a3714ad7628f0a65a4d43a.png
它就是——fly-cut.
fly-cut 利用 webcodecs 实现 Web 端视频编辑工具,雷同剪映Web版。底层前端采用vue3框架, 接下来先和各人演示一下这款开源项目.
demo演示
https://i-blog.csdnimg.cn/blog_migrate/839182b1b1845616b75ae59bfe86eda1.gif
我们可以上传图片或者视频, 在编辑器中举行二次编辑, 同时它还支持多种媒体轨道, 也可以对音频举行编辑.
https://i-blog.csdnimg.cn/blog_migrate/8a198fc36b691fb44e2b184bae887c27.png
github地点: https://github.com/x007xyz/fly-cut
焦点技能栈分析
我研究了一下这个项目的 github 代码, 和各人分享几个焦点技能栈, 各人也可以基于他们应用在本身的项目中:
[*]@ckpack/vue-color:是在 Vue 应用中处置处罚颜色相关功能的插件。
[*]@element-plus/icons-vue:提供 Element Plus 框架的图标组件。
[*]@leafer-in/editor 和 @leafer-in/view:图像编辑器和视图相关组件或模块。
[*]@vueuse/core:提供一系列实用的 Vue 组合式函数。
[*]@webav/av-canvas 和 @webav/av-cliper:视频或图像处置处罚库。
[*]axios:用于举行 HTTP 哀求的库。
[*]element-plus:Vue 组件库。
[*]leafer-ui:可能是图像编辑器的 UI 组件库。
[*]lodash-es:提供实用工具函数。
[*]opfs-tools:特定文件系统或工具相关的工具。
[*]pinia:用于 Vue 应用的状态管理。
[*]spark-md5:用于盘算 MD5 哈希值。
[*]vue:前端MVVM框架。
[*]vue-hooks-plus:可能提供一些额外的 Vue 钩子函数。
[*]vue-router:用于 Vue 应用的路由管理。
[*]vue3-moveable:用于实现可移动的组件或元素。
[*]wavesurfer.js:用于音频相关的处置处罚或展示。
技能交换
最近建了一个独立开发者社群, 感兴趣的小伙伴可以到场交换独立开发的一二.
https://i-blog.csdnimg.cn/blog_migrate/e148d021aef7a2e51bd883c4e8f559a6.png
后期规划
各人对于今天的分享有好的发起, 也欢迎随时和我反馈交换~
最近也独立了一款可视化文档编辑器, 雷同飞书和Notion.
体验地点: http://react-flow.com/docx
后续我也会连续迭代 H5-Dooring 零代码项目,让它成为最好用的可视化 + 无代码应用搭建工具,假如各人感兴趣,也随时欢迎留言区反馈交换~
https://i-blog.csdnimg.cn/blog_migrate/3ac9d01b82d14e5e5e850e1392d4b597.png
往期精彩
[*]零代码+AI的阶段性复盘
[*]文档引擎+AI可视化打造下一代文档编辑器
[*]爆肝1000小时, Dooring零代码搭建平台3.5正式上线
[*]从零打造一款基于Nextjs+antd5.0的中后台管理系统
免责声明:如果侵犯了您的权益,请联系站长,我们会及时删除侵权内容,谢谢合作!更多信息从访问主页:qidao123.com:ToB企服之家,中国第一个企服评测及商务社交产业平台。
页:
[1]