我写了一个低代码平台

简介 ⛏️

• Github
• 点我体验
• 当时写这个平台主要是因为毕业几年基本做的都是后台管理系统。后台管理系统用的最多且需要配置的组件的就是Table、Form和弹窗这三个组件。
• 这几个组件都已经写的滚瓜烂熟，但是表格字段、表单项都是根据业务需求一直变化的。
• 这就导致我们我们需要一直重复的写Tbale、Form这些表单组件，然后把字段信息填上去。
• 工作一年后，我就在想可不可以写一个平台，提供方便配置表格字段和表单项的方式，然后把重复的代码根据模板生成出来，提供代码预览、复制和导出功能。

基本功能 🔥

如下图所示，左侧分别是对应Table、Form、Modal和自定义内容的组件（组件可以添加表格、表单和普通文本）。
中间部分是预览区域，根据配置生成预览界面。同时预览区域也可以做一下配置，比如添加字段，拖拽改变字段顺序等等
右边则是配置区域，一般会有组件的属性配置，比如下图的Table配置就是全部填充到Table组件里面的参数
全部配置则有导出代码时。导出文件名及后缀名的配置（目前支持jsx和tsx两种文件导出）
此外还有组件的名称、保存配置生成模板的名称都在此处配置

此外点击中间预览区域的表头，还会出现字段的配置

基本操作 ✏️

一. 代码预览

当你做好配置时，可以点击左上角的预览按钮，右边就会打开一个抽屉
里面是包含该组件根据定义的配置生成的代码，可以直接复制到项目里使用

二. 导出代码

如果希望将其导出为一个jsx或者tsx文件，复制到项目里使用可点击导出代码按钮，会下载一个文件
文件名后缀名可以在全局配置里面自定义

三. 保存配置

点击保存按钮，会将本次配置的保存为一个模板，下次进来可以点击模板Tag快速加载配置。可以保存多个模板。

四. 导出模板 & 导入模板

• 将保存的模板导出为配置文件，可以分享给别人，然后通过导入配置的方式，加载别人定义的模板配置
• 比如我把这个平台丢给后端，然后说表格、表单的接口字段名可以在这上面进行配置，接口定义好之后将其保存为 模板，然后导出发给我
• 直接减少接口定义之前，静态页面的开发时间。前提是后端会配合，哈哈哈，大概率不会。
• 希望后续可以把这个平台开发成产品经理可用的，产品在这里画简单的原型，然后导出给前端使用。前端又有时间Touch Fish了，嘻嘻嘻

组件介绍 🏆

这里只介绍弹窗组件，因为弹窗的内容可以配置表格、表单Form和文本DOM

• 各个组件的全局配置需要点击中间预览区域的空白处
• 弹窗的内容，文本、表格、表单都是可以增删、拖拽排序的
• 表格和表单的全局配置则需要点在表单、表格的空白处，但不是字段的区域
• 那字段的配置，则是直接点击字段区域右侧就会加载对应的字段配置
• 表格字段配置和字段拖拽排序都是需要点击表头
• Form表单直接点击拖拽表单字段即可

最后 🚁

功能其实非常简单，大家在上面的点我体验几分钟就能熟悉使用
既然看到这里了，码字不易多谢各位靓仔靓妹给个点赞收藏，最好Github上能给我点个小小的Star，万分感谢
最后觉得这个项目可以提高开发效率，可以加我微信vgbire。
我们拉群探讨一下低代码相关的知识、技能来完善这个项目。以减少开发时间，提高摸鱼效率（坏笑.jpg）