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

我设计了一个低代码平台，尽可能兼顾了可视化和原生组件开发，以求在可视化拖动布局和代码开发中取得良好的平衡。

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

目前还远远没有达到我理想的构建情况，想法有很多，不过短时间内应该都不能实现，在这里也想听取一下大家对低代码平台的看法，设计这个平台的初衷也是因为我也是低代码平台的受害者，因此我自己设计了这个平台，来做一个我心目中真正能提高开发效率，且不会让我那么痛苦的平台，不过在开发过程中也不是那么顺利，很多想法也做了妥协，不过好在现在终于有一个看的过去的产品可以和大家一起聊一聊了。

体验地址

wecliang.github.io/wiz-test/

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

设计特点

1. 在线代码编辑器： 使用Monaco-editor编辑器，平台无需内置大量组件，转而支持线上代码编辑，仅需要提供基础组件库或内置业务相关组件（如任务流）。简化平台结构，提高开发效率。
2. 强大的组件开发能力： 提供了全面的组件开发支持，例如生命周期，变量，并支持绑定ref和context来获取数据，尽可能提供了完整的组件开发能力。
3. 自动化的Props参数处理： 组件的props参数无需额外编写代码，通过自定义的TypeScript货JSONSchema数据（在可视化下为schema编辑，代码编辑器下为typescript），实现了参数表单的生成。
4. 可视化布局与代码编辑的无缝切换： 平台支持可视化布局和代码编辑的互相转换，但在这个过程中牺牲了一些代码编辑的自由度（为了能够进行可视化布局转换）
5. 高性能原生运行体验： 构建产出js、css文件，确保了平台的原生运行速度，提供更流畅的用户体验。
6. 多组件化： 依赖组件线上化，随着使用的项目增多，可提供了丰富的可用组件，使得每个业务都能够方便地选择和使用适合的组件。

使用方式

需要先创建一个页面，页面默认时禁用状态，页面开发完成可通过右上角按钮打开页面

可视化编辑

提供了最基础的编辑方式，提供了html基础组件、内置（arco）和自定义组件来搭建页面布局

代码开发

ui arco.design/
数据交互 mobx

如果你是一个开发人员，你可以通过点击vscode 切换到编辑器模式，不过这里面有几个注意点

1. 所有变量定义和生命周期需要在store 定义，不支持使用 useState 定义变量
2. 支持 created、mounted、beforeUnmount 生命周期，以及可以定义 useEffects
3. 在jsx可以使用变量，但无法使用计算函数，可以通过在store 中定义get 变量，然后在页面使用

目前开发的点先说这么多，后续我会提供更多的线上组件可以供大家使用体验

代码编辑可以通过点击预览实时查看当前ui效果，修改代码后需要通过点击【执行】或使用快捷键【Ctrl + S】进行构建

目前平台尚处于不太稳定的阶段，更像一个概念而非完整的产品。该产品是纯前端的，尚未接入实际数据。如果你对其感兴趣，体验中有任何问题，欢迎随时向我提供反馈。