阿里低代码引擎开源两年啦~

本文正在参加阿里低代码引擎征文活动~

在编程领域,低代码也算是一个经久不衰的话题了,每个公司、甚至每个开发者都有着独属于自己的一套开发范式,用来提高编程效率。

相较于后端的封装开发框架、封装常用工具包,前端的低代码编程发展会更有成果一些,因为页面、表单、表格这些可视化的东西,天然适合用低代码进行赋能。

国内的一些大厂,比如阿里巴巴就开源了 LowCodeEngine 这个低代码引擎,并在此基础上发展了一些商业化性质的低代码平台(Lab、UIPaaS)。

今天就带大家一块体验一下 LowCodeEngine 的低代码能力~

LowCodeEngine 介绍

LowCodeEngine 是一款开源的低代码引擎,没错它是一个引擎,并不是一个完整的低代码平台,为了让大家有一个清晰的印象,我找了一张图来说明这点:

从上往下看,LowCodeEngine 已经完成了下面三层,你可以借助生态这一层的能力对LowCodeEngine 进行很多的自定义设置和封装操作,让它成为一个完整的低代码平台。

或者如果你对页面要求不高,也可以直接使用 LowCodeEngine 进行搭建,因为它自身也附带了许多物料,但是整体样式上不够精美,对于一些复杂页面还是比较吃力的。

如果你是一个前端开发者,需要通过这个引擎定制一个低代码平台,那么你关注的侧重点应该在生态这里,LowCodeEngine 的生态分为:物料生态、设计器生态和插件生态。

这三个生态也是三处扩展点,可以让定制开发者对其进行任何修改与开发。

LowCodeEngine 在模块化划分上可以分为以下几个模块:入料、编排、渲染和出码。

入料:是指将一些已经存在的组件给注册到低代码引擎中,然后在编辑器中进行使用,比如可以注册许多开源的前端组件库。

编排:是指对一个初始页面进行布局与组建的配置,在其官网例子中就有一个AntD组建例子。

渲染和出码:都是低代码引擎的内部流程,一般用户无需关注。

这几个模块各司其职,也正是这种模块化的划分,LowCodeEngine 预留了许多扩展点,这些扩展点为LowCodeEngine 的生态做出了技术保障。

LowCodeEngine 试用

对于一个用户来说,使用一个低代码平台,它起码要具备以下功能:

  1. 可视化页面搭建
  2. 可视化模型设计
  3. 可视化流程设计
  4. 可视化报表及数据分析

虽然 LowCodeEngine 只是一个引擎,但是其官网上也给了一些简单的在线可编辑器Demo,我们可以从中一窥用法:

如果想使用 AntD 组件低代码一个页面,那么可以选择 基础AntD组件 这个例子:

然后点击图标这个按钮,就会出现许多 AntD 中的组件,可以将其随意拖动到画布中去,然后在这个页面上进行可视化的编辑操作。

但是这个例子中的只有固定的一个页面,无法进行多页面操作。


多页面操作中需要点击 应用级设计器,在这个例子中,可以看到它多了一个资源页面层级:

在这个页面里面每创建一个页面就是一个菜单栏选项卡,我们可以点击右上角的预览看一下效果:

可以看到侧边栏和我们之前创建的页面层级是一一对应的,通过这种方式可以方便的在多个页面中同时进行前端设计。

以上这些就是官方利用低代码引擎设定的一些模板,你也可以利用这个引擎的扩展点设置一些自己常用的模板。

有兴趣的同学可以去 Github 下载一下 LowCodeEngine 进行研究或者定制化开发~

相关推荐
leobertlan7 小时前
2025年终总结
前端·后端·程序员
子兮曰7 小时前
OpenClaw架构揭秘:178k stars的个人AI助手如何用Gateway模式统一控制12+通讯频道
前端·javascript·github
百锦再8 小时前
Reactive编程入门:Project Reactor 深度指南
前端·javascript·python·react.js·django·前端框架·reactjs
Ashley的成长之路8 小时前
2025 年最新:VSCode 中提升 React 开发效率的必备插件大全
ide·vscode·react.js·工作提效·react扩展
莲华君8 小时前
React快速上手:从零到项目实战
前端·reactjs教程
百锦再8 小时前
React编程高级主题:测试代码
android·前端·javascript·react.js·前端框架·reactjs
易安说AI8 小时前
Ralph Loop 让Claude无止尽干活的牛马...
前端·后端
颜酱10 小时前
图结构完全解析:从基础概念到遍历实现
javascript·后端·算法
失忆爆表症10 小时前
05_UI 组件库集成指南:Shadcn/ui + Tailwind CSS v4
前端·css·ui
小迷糊的学习记录10 小时前
Vuex 与 pinia
前端·javascript·vue.js