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

在说低代码搭建之前，首先要理解什么是搭建（本文搭建指通过 Web 交互搭建一个自定义的新页面）。 对研发人员的提效：相对于 Pro Code 模式，搭建的抽象程度更高，通过牺牲部分定制性换来更高效的开发方式。 对客户的提效：如果用户有任何搭建 Web 应用的诉求，本质上从阿里云…

刚刚也提到了刚刚接触到Sifo的时候我以为他是一个low code的解决方案，但是这个表述并不准确，先来看下另外一款类似能力的解决方案，也就是百度的amis，这款解决方案的话他的着眼点就完全在于low code，旨在全部通过JSON配置的方式快速低成本的搭建出前端页面。而Sif…

我将向大家分享可视化系列文章，介绍我们的前端开源图表库📈 CloudCharts（Github） 如何基于 G2 封装，通过少量配置项即可绘制图表，最终服务内部近两百个产品和许多对外云产品。 在 React 中使用 G2 有 BizCharts 和 Viser 等方案，但他们…

自 react、vue 等数据驱动的框架流行以来，诞生了许多相关组件库，但这些组件库的编程模式基本都是大同小异，虽然这些年都在不断迭代，但除了功能更加丰满，长相更加好看之外，也基本上没有什么质的变化。在 material、antd 等垄断地位下，也很少有个人或公司去选择做组件库…

笔者之前花了大量的时间在思考如何设计和实现H5页面可视化编辑器H5-Dooring，从第一个版本到现在经历了很多次版本迭代和优化，也收到了很多宝贵的建议，目前刚好完成了移动端数据可视化的基本设计和落地方案，在这里特地总结和复盘一下。 在开始正式实现之前笔者先对H5数据可视化做一…

前段时间笔者一直忙于数据可视化方面的工作，比如如何实现拖拽式生成可视化大屏，如何定制可视化图表交互和数据导入方案等，这块需求在B端企业中应用非常大，所以非常有探索价值。 本篇文章并非和数据可视化相关，而是通过抽象技术底层，将其应用于H5页面可视化搭建上，通过技术的手段实现拖拽式…

通过实现一个json在线编辑器,来学习如何一步步封装自己的组件(不限于react,vue,原理类似). 在介绍组件设计思路之前,有必要介绍一下著名的SOLID原则. S 单一功能原则: 规定每个类都应该有一个单一的功能，并且该功能应该由这个类完全封装起来。所有它的服务都应该严密…

整个可视化搭建系统分为三部分，分别是配置页(setting),视图页(view) 和 json schema。配置页生成 json schema，视图页消费 json schema 可创建的页面类型有：列表、详情、表单。详情和表单页的设计思路差别不大，列表页与另外两种页面差别比…