
本文正在参加阿里低代码引擎征文活动~
在编程领域,低代码也算是一个经久不衰的话题了,每个公司、甚至每个开发者都有着独属于自己的一套开发范式,用来提高编程效率。
相较于后端的封装开发框架、封装常用工具包,前端的低代码编程发展会更有成果一些,因为页面、表单、表格这些可视化的东西,天然适合用低代码进行赋能。
国内的一些大厂,比如阿里巴巴就开源了 LowCodeEngine 这个低代码引擎,并在此基础上发展了一些商业化性质的低代码平台(Lab、UIPaaS)。
今天就带大家一块体验一下 LowCodeEngine 的低代码能力~
LowCodeEngine 介绍
LowCodeEngine 是一款开源的低代码引擎,没错它是一个引擎,并不是一个完整的低代码平台,为了让大家有一个清晰的印象,我找了一张图来说明这点:

从上往下看,LowCodeEngine 已经完成了下面三层,你可以借助生态这一层的能力对LowCodeEngine 进行很多的自定义设置和封装操作,让它成为一个完整的低代码平台。
或者如果你对页面要求不高,也可以直接使用 LowCodeEngine 进行搭建,因为它自身也附带了许多物料,但是整体样式上不够精美,对于一些复杂页面还是比较吃力的。
如果你是一个前端开发者,需要通过这个引擎定制一个低代码平台,那么你关注的侧重点应该在生态这里,LowCodeEngine 的生态分为:物料生态、设计器生态和插件生态。
这三个生态也是三处扩展点,可以让定制开发者对其进行任何修改与开发。
LowCodeEngine 在模块化划分上可以分为以下几个模块:入料、编排、渲染和出码。

入料:是指将一些已经存在的组件给注册到低代码引擎中,然后在编辑器中进行使用,比如可以注册许多开源的前端组件库。
编排:是指对一个初始页面进行布局与组建的配置,在其官网例子中就有一个AntD组建例子。
渲染和出码:都是低代码引擎的内部流程,一般用户无需关注。
这几个模块各司其职,也正是这种模块化的划分,LowCodeEngine 预留了许多扩展点,这些扩展点为LowCodeEngine 的生态做出了技术保障。
LowCodeEngine 试用
对于一个用户来说,使用一个低代码平台,它起码要具备以下功能:
- 可视化页面搭建
- 可视化模型设计
- 可视化流程设计
- 可视化报表及数据分析
虽然 LowCodeEngine 只是一个引擎,但是其官网上也给了一些简单的在线可编辑器Demo,我们可以从中一窥用法:

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

然后点击图标这个按钮,就会出现许多 AntD 中的组件,可以将其随意拖动到画布中去,然后在这个页面上进行可视化的编辑操作。
但是这个例子中的只有固定的一个页面,无法进行多页面操作。
多页面操作中需要点击 应用级设计器,在这个例子中,可以看到它多了一个资源页面层级:

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

可以看到侧边栏和我们之前创建的页面层级是一一对应的,通过这种方式可以方便的在多个页面中同时进行前端设计。
以上这些就是官方利用低代码引擎设定的一些模板,你也可以利用这个引擎的扩展点设置一些自己常用的模板。
有兴趣的同学可以去 Github 下载一下 LowCodeEngine 进行研究或者定制化开发~