当客户在使用我们的产品过程中，遇到问题需要向我们反馈时，如果用纯文字的形式描述，我们很难懂客户的意思，要是能配上问题截图，这样我们就能很清楚的知道客户的问题了。 那么，我们就需要为我们的产品实现一个自定义截屏的功能，用户点完"截图"按钮后，框选任意区域，随后在框选的区域内进行圈…

建议结合源码一起阅读，效果更好（这个 DEMO 使用的是 Vue 技术栈）。 1. 编辑器 先来看一下页面的整体结构。 这一节要讲的编辑器其实就是中间的画布。它的作用是：当从左边组件列表拖拽出一个组件放到画布中时，画布要把这个组件渲染出来。 用一个数组 componentDat…

人脑有限，对于同一个问题，也许当时花了许久时间解决了，然而过了一段时间，只留下一个印象，当再次需要解决时，还是需要较长时间来寻找以前的资料。因此，在这里建立个人博客，一是为了整理记录，让自己省心；二是知识的分享，如果这里的信息恰好能够帮助你，我同样也会感到非常开心。 其实在一年…

一般人没事的时候刷刷朋友圈、微博、电视剧、知乎，而有些人是没事的时候刷刷 GitHub ，看看最近有哪些流行的项目。 久而久之，这差距就越来越大，因此总会有开源信息的不对称，有哪些优秀的前端开源项目值得学习的也不知道。 初步前端与高级前端之间，最大的差距可能就是信息差造成的。 …

上面分享的这些工具，都是怪怪工作中经常用并且觉得还不错的工具。上面分享的这些工具，都是怪怪工作中经常用并且觉得还不错的工具。

作为一个对UI和动画敏感的切图仔，在日常开发之余，也会关注一些贼好看的图表库和插件。 接下来，我将给大家介绍几款web/python/vue/react里漂亮得不行的开源库/实现。 1. 手绘风图表库：roughViz.js 基于D3(v5), roughjs, 和handy。…

很早之前就在掘金看到过关于实现断点续传的文章，但未曾实践过，正好最近项目中也遇到了此场景，便去重温了一遍，从头到底做了实现。 先写写总结，个人认为，本项目主要难点在于处理多个文件上传时，如何将每个文件的状态及进度对应到相关的界面展示中。绕了很多坑。 做到重试时，卡了半天，实在想…

早前在粉丝群里说过，想要从零开始开发一个开源项目，这个项目的目的很简单：新人可以练手，一步一步搭建项目，把时下流行的技术整合进来，在用这些技术的特性来实现具体业务功能，而对于有经验的老鸟可以把自学的技术在项目中得以实践。 琢磨了挺长时间，前段时间工作比较忙、家中事情也比较多，导…

在开发公司UI组件库的过程中，颜色组件ColorPicker由于时间关系没有去深入研究，看着花花绿绿的色谱图，以为实现起来会很复杂，就直接将一个开源的颜色选择器封装了一下。这大概是半年以前的事了，这篇文章也在我的博客中以草稿形式（只有标题没有内容，当时是做了一个记录，想着后来有…