【低代码】前端低代码开发日记1_快速迭代，探索之路

在2023年萌生了前端低代码开发的想法，从12月正式开始动手，期间开发的时间并不多，都是断断续续的。如今回过头来看，想稍微总结一下开发的几个阶段以及遇到的一些问题。

快速迭代，探索之路

早期对低代码的理解基本为零，没有查阅过太多资料，完全是“摸着石头过河”，直接进入了开发阶段。初期开发过程中，参考了阿里低代码引擎的一些设计理念：阿里低代码引擎

由于我是基于Vue进行开发，所以一开始就希望设计能够符合Vue单文件组件（SFC）的开发习惯，方便最终能导出标准的Vue SFC代码。在这个过程中，我构思并设计了以下几个核心功能：

• 设计：用于拖拽组件，类似于Vue中的template部分。
• 组件列表：通过JSON方式描述组件的方法、属性和事件。
• Schema：整个Vue组件的JSON化描述，用于配置整体页面结构。
• 代码：可以预览并导出Vue的代码。
• 样式：对应DOM元素的style属性配置。
• 属性：组件的属性配置，对应Vue中props的部分。
• 事件：绑定组件事件，既包括Vue中的事件绑定，也涵盖HTML原生事件。
• 变量：定义组件内部的变量，对应Vue的data部分。
• 压缩并导出：支持导出自定义格式（如.lc后缀）的文件，以便导入到其他组件中。
• 预览页面：编辑后的页面可以实时预览。

通过这些功能，我构建了一个较为完整的框架。大概的界面设计如下所示：

这个阶段的成果主要体现在能够实现静态页面的编辑，生成一个完整的静态页面已经不是问题。不过，功能仍然有限，暂时还只能处理纯静态内容。

体验最新的轻构低代码
账号：test
密码：123456