我做了一个尽可能让开发者用起来更舒服的的低代码平台

174 天前
 cc12158

设计理念:构建开发者友好、高度灵活且高效的低代码平台

设计这个平台的初衷也是因为我也是低代码平台的受害者,因此我自己设计了这个平台,来做一个我心目中真正能提高开发效率,且不会让我那么痛苦的平台,不过在开发过程中也不是那么顺利,很多想法也做了妥协,不过好在现在终于有一个看的过去的产品可以和大家一起聊一聊了。

体验地址

https://wecliang.github.io/wiz-test/

目前这是一个简单的示例网站,保留了基本的设计特点(不过在开发中还有很多事项还没有来及说明,如果你感兴趣,后续我讲继续补充开发的细节)

设计特点

  1. Monaco-editor 在线代码编辑器: 使用 Monaco-editor 编辑器,平台无需内置大量组件,转而支持线上代码编辑,仅需要提供基础组件库或内置业务相关组件(如任务流)。这有助于简化平台结构,提高开发效率。
  2. 强大的组件开发能力: 提供了全面的组件开发支持,例如生命周期,变量,并支持绑定 ref 和 context 来获取数据,尽可能提供了完整的组件开发能力。
  3. 自动化的 Props 参数处理: 组件的 props 参数无需额外编写代码,通过自定义的 TypeScript 货 JSONSchema 数据(在可视化下未 schema 编辑,代码编辑器下为 typescript ),实现了参数表单的生成。
  4. 可视化布局与代码编辑的无缝切换: 平台支持可视化布局和代码编辑的互相转换,但在这个过程中牺牲了一些代码编辑的自由度(为了能够进行可视化布局转换)
  5. 高性能原生运行体验: 构建产出 js 、css 文件,确保了平台的原生运行速度,提供更流畅的用户体验。
  6. 多组件化: 依赖组件线上化,随着使用的项目增多,可提供了丰富的可用组件,使得每个业务都能够方便地选择和使用适合的组件。
3454 次点击
所在节点    分享创造
30 条回复
foolishcrab
174 天前
一个低代码产品,项目特色的第一点是另一个项目,而且是一个代码编辑器项目。您觉得合适吗?
cc12158
174 天前
@foolishcrab 编辑器确实是其中重要的一环,在设计中思考过很多,目前开发起来最顺手效率最高的还是直接写代码,嵌入代码编辑器只是因为目前线上的组件还无法做到直接使用 vscode 编辑,所以采用线上编辑器的方式去开发,尽可能的降低组件开发的成本,并且所产出的组件可以直接给业务人员使用。
musi
174 天前
就这交互叫好用?
helloet
174 天前
请问可视化编辑器是自己写的还是用的组件库呀?
cc12158
174 天前
@musi 目前这个交互都是我自己做的,没有经过专业人士的设计,后续如果能做起来,在考虑找设计师优化下,前期考虑到成本,如果做不起来找设计师成本太高了
cc12158
174 天前
@helloet 可视化编辑器用到了 react-dnd 作为拖放功能的基础,不过大部分拖动逻辑都是自己写的
yangg
174 天前
感觉还不错,支持!
yangg
174 天前
现在不能拖动选中一个区域的所有组件?
cc12158
174 天前
@yangg 目前还不能批量选中组件,可以将区域内的组件放在同一个 div 下面,拖动 div
qingshui33
174 天前
不是说你这个项目,你这个项目当然是很不错的,看得出来也花了很多精力和时间,很不错,加油 👍 (是就我目前的经验来说,低代码平台在我看来,可用的范围非常的狭窄,而对比他的开发和学习使用的成本来说,是完全不等价的,市面上的低代码平台是真的,,,我怀疑要么就是为了完成 KPI ,要么就是忽悠投资者和用户的,当然也有其他的原因)
cc12158
174 天前
@qingshui33 谢谢你的支持,你说的问题其实也是我遇到并想改变的,我也是低代码平台的受害者(公司内部开发的)当前我也是其中参与的开发者,随着项目做的越来越多实际上并没有让我的工作变得更轻松,每个项目的差异点都很大,反而为了满足各种需求,做的身心疲惫。只有相同的业务可以提高效率,稍有差异反而就会使其效率极其低下。
panda1079
174 天前
这玩意好别扭,会前端的不屑于用,不会前端的不会用
Real00
174 天前
简单使用了一下,交互并没有低代码开发的爽快感,很多组件的时候缺少跟键盘快捷键和鼠标的互动。
比如编辑过程中 esc 、enter ,delete 等按键没有效果,双击组件无法弹出对应的编辑框,右键也没有组件菜单
另外就是左边的组件栏只有英文名,视觉上不好选。
看你是想解决快速出活还是满足灵活定制的问题了,前者应该有强大丰富的组件库,直接拖入即可用,后者应该是屏蔽掉一些编码细节,直接放 jsx 出来,应该很多人觉得还不如自己写
hrzpaul02020
174 天前
我觉得 amis 这种低代码的思路是更好
如果是编辑器不如直接上 web 版 vscode
就是 ui 有点朴素 json 有点多
JLVe
174 天前
@hrzpaul02020 +1 amis 面向后台页面的场景,内置的组件很多。
cc12158
174 天前
@Real00 谢谢你的建议,我要做的是可以快速出活,你说的这些交互细节后续我也会添加进去,当然更进一步的方向还需要重新梳理
murmur
174 天前
低代码仅适用于企业开发 OA 、审批类应用,你这个属于四不像,你场景是什么
cc12158
174 天前
@hrzpaul02020 理想状态肯定是在 vscode 上面能够直接开发更好,目前模块数据是存储在数据库中只有在页面用到的时候才会进行渲染,具体怎么实现在 vscode 中进行组件编辑和开发目前还没有一个好的切入思路
cc12158
174 天前
@murmur 真正要能够应用还需要接入主数据来辅助完成页面交互,目前是一个纯粹的低代码编辑器,还不包含业务场景,后续我会找一些简单的场景作为切入点,尝试做个产品试一下
murmur
174 天前
@cc12158 你这代码编辑器都露出来了,一点都不低啊,现在的审批类应用开发都是移动端 pc 端界面自适应,还用得着写这么复杂的代码,甚至还得自己处理 store

多去调研调研市面上产品吧

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/1006989

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX