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

[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. 多组件化： 依赖组件线上化，随着使用的项目增多，可提供了丰富的可用组件，使得每个业务都能够方便地选择和使用适合的组件。

当前的产品更像是一个概念验证，还未涉足主数据。它仅仅是为了验证我内心的一个想法而存在。我的目标是通过这个产品，降低低代码平台中组件创建的成本，并且摆脱可视化布局对组件的严格限制，避免使系统变得臃肿。 产品开发理念类似于大家共同参与的积木游戏，就像乐高积木的制造者负责生产各种积木，而用户则像搭积木一样，通过选择和组合这些积木来构建成品。我们的目标是提供尽可能多种类的积木，让用户可以轻松地找到并使用适合他们需求的积木，而无需过多关注底层逻辑。

[foolishcrab]

一个低代码产品，项目特色的第一点是另一个项目，而且是一个代码编辑器项目。您觉得合适吗？

[cc12158]

@foolishcrab 编辑器确实是其中重要的一环，在设计中思考过很多，目前开发起来最顺手效率最高的还是直接写代码，嵌入代码编辑器只是因为目前线上的组件还无法做到直接使用 vscode 编辑，所以采用线上编辑器的方式去开发，尽可能的降低组件开发的成本，并且所产出的组件可以直接给业务人员使用。

[musi]

就这交互叫好用？

[helloet]

请问可视化编辑器是自己写的还是用的组件库呀？

[cc12158]

@musi 目前这个交互都是我自己做的，没有经过专业人士的设计，后续如果能做起来，在考虑找设计师优化下，前期考虑到成本，如果做不起来找设计师成本太高了

[cc12158]

@helloet 可视化编辑器用到了 react-dnd 作为拖放功能的基础，不过大部分拖动逻辑都是自己写的

[yangg]

感觉还不错，支持！

[yangg]

现在不能拖动选中一个区域的所有组件？

[cc12158]

@yangg 目前还不能批量选中组件，可以将区域内的组件放在同一个 div 下面，拖动 div

[qingshui33]

不是说你这个项目，你这个项目当然是很不错的，看得出来也花了很多精力和时间，很不错，加油 👍 （是就我目前的经验来说，低代码平台在我看来，可用的范围非常的狭窄，而对比他的开发和学习使用的成本来说，是完全不等价的，市面上的低代码平台是真的，，，我怀疑要么就是为了完成 KPI ，要么就是忽悠投资者和用户的，当然也有其他的原因）

[cc12158]

@qingshui33 谢谢你的支持，你说的问题其实也是我遇到并想改变的，我也是低代码平台的受害者（公司内部开发的）当前我也是其中参与的开发者，随着项目做的越来越多实际上并没有让我的工作变得更轻松，每个项目的差异点都很大，反而为了满足各种需求，做的身心疲惫。只有相同的业务可以提高效率，稍有差异反而就会使其效率极其低下。

[panda1079]

这玩意好别扭，会前端的不屑于用，不会前端的不会用

[Real00]

简单使用了一下，交互并没有低代码开发的爽快感，很多组件的时候缺少跟键盘快捷键和鼠标的互动。
比如编辑过程中 esc 、enter ，delete 等按键没有效果，双击组件无法弹出对应的编辑框，右键也没有组件菜单
另外就是左边的组件栏只有英文名，视觉上不好选。
看你是想解决快速出活还是满足灵活定制的问题了，前者应该有强大丰富的组件库，直接拖入即可用，后者应该是屏蔽掉一些编码细节，直接放 jsx 出来，应该很多人觉得还不如自己写

[hrzpaul02020]

我觉得 amis 这种低代码的思路是更好
如果是编辑器不如直接上 web 版 vscode
就是 ui 有点朴素 json 有点多

[JLVe]

@hrzpaul02020 +1 amis 面向后台页面的场景，内置的组件很多。

[cc12158]

@Real00 谢谢你的建议，我要做的是可以快速出活，你说的这些交互细节后续我也会添加进去，当然更进一步的方向还需要重新梳理

[murmur]

低代码仅适用于企业开发 OA 、审批类应用，你这个属于四不像，你场景是什么

[cc12158]

@hrzpaul02020 理想状态肯定是在 vscode 上面能够直接开发更好，目前模块数据是存储在数据库中只有在页面用到的时候才会进行渲染，具体怎么实现在 vscode 中进行组件编辑和开发目前还没有一个好的切入思路

[cc12158]

@murmur 真正要能够应用还需要接入主数据来辅助完成页面交互，目前是一个纯粹的低代码编辑器，还不包含业务场景，后续我会找一些简单的场景作为切入点，尝试做个产品试一下

[murmur]

@cc12158 你这代码编辑器都露出来了，一点都不低啊，现在的审批类应用开发都是移动端 pc 端界面自适应，还用得着写这么复杂的代码，甚至还得自己处理 store

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

[lstz]

礼貌问一下开源吗

[cc12158]

@lstz 目前还只是一个概念，后续优化方向有很多也没固定，可能会做成纯前端的插件开源

[cc12158]

@murmur 感谢你的建议，代码编辑器暴露出来是因为为了演示，分割的一个半成品没有做身份区分，正常应该只有开发者可以看到代码编辑器。
说是低代码是希望在业务足够丰富的情况下，可以有足够的模块来支撑业务的搭建。
目前我也在重新规划后续的发展方向，如果你有好的产品也可以推荐给我🙏，也许这对我很重要。

[murmur]

@cc12158 我说的很清楚，你的场景是哪里，如果是根据设计图出 html 和 css ，别人有 AI
如果是企业办公类应用，现在任何一个商业 OA 都带对应的快速开发平台
其余的场景因为代码生成器做的太死了，还不如 gpt 手写

[lstz]

@cc12158 谢谢回复，加油！

[wwk]

交互一脸懵啊。拿来推广验证的话，建议砍掉或者隐藏掉一些非必要功能，降低上手门槛。

[racgas]

其实我心目中的低代码开发平台基本就是 elementui 那样的 ui 组件库

[helloet]

@cc12158 #6 很厉害👍

[denghongcai]

和网易的 tango 很像

[twelife]

很棒，加油