这篇文章大约有2500字,建议阅读时间为9分钟。
本文分享了几个值得学习和使用的前端低代码开源项目,以便更深入地了解什么是低代码。
近几年,低代码在技术领域越来越受到关注,例如阿里云推出的钉钉低代码,可以通过简单的拖拽和配置实现业务应用的搭建;腾讯云也推出了微搭,可以利用行业化模板、拖放式组件和可视化配置快速构建多端应用。
基于可视化、模型驱动和云原生技术,低代码能够为专业开发者提供一种新的可高效开发的范式,从而在多业务场景实现节约成本的目的。下面将介绍几个优秀的开源低代码前端项目,以更好地了解低代码。
1 Appsmith
Appsmith 是一种开源低代码框架,可以快速构建管理面板、内部工具和仪表板等,它允许用户拖放 UI 组件以构建页面,连接任何 API、数据库或 GraphQL 源,并使用 JavaScript 语言编写逻辑,即可在短时间内完成内部应用程序的创建。
可以在GitHub上找到Appsmith的项目,它的链接为https://github.com/appsmithorg/appsmith。
最新star:24288
2 LowCodeEngine是一个快速建站平台
阿里巴巴钉钉宜搭团队开发的LowCodeEngine是一款基于阿里云云基础设施和钉钉企业数字化操作系统的低代码框架,使用者可以利用它快速定制符合自己业务需求的低代码平台,同时LowCodeEngine还提供了丰富的基础组件,为开发者构建业务页面提供便利。
您可以在GitHub上找到阿里巴巴的lowcode-demo项目链接:https://github.com/alibaba/lowcode-demo。
最新star:887
3 Amis
百度开源的Amis是一款前端低代码框架,它可以通过 JSON 配置生成后台页面,具备数据获取、表单提交及验证等功能,内置100+种 UI 组件,可以满足多种需求,大大降低开发成本,甚至可以不涉及前端。Amis在百度内部得到了广泛应用,已经创建了3000多页面,覆盖了从内容审核到机器管理、从数据分析到模型训练的各个领域。想体验Amis,只需要下载源码,然后执行相应的命令即可。
百度开源的项目”amis”可以在GitHub上找到,链接是:https://github.com/baidu/amis。
最新star:12860
4 tmagic-editor
腾讯技术中心推出的tmagic-editor开源低代码框架,可以实现零代码/低代码生成页面,能够帮助非技术人员快速搭建可视化页面生产平台,通过拖拽和配置即可自助生成H5页面、PC页面、TV页面,从而大大降低页面生产成本。
项目链接:https://github.com/Tencent/tmagic-editor
最新star:3112
5 dooring-electron-lowcode
Dooring-electron-lowcode是一种功能强大、专业可靠的可视化页面配置解决方案,旨在为用户提供一种简单易用、专业可靠、可实现无限可能的H5落地页解决方案。它的技术栈以React和Typescript为主,而后台采用Node.js开发,Electron作为桌面端基础方案。
您可以在GitHub上找到H5-Dooring的Dooring Electron Lowcode项目:https://github.com/H5-Dooring/dooring-electron-lowcode。
最新star:150
6 vite-vue3-lowcode
Vite-vue3-lowcode 是一款基于Vite2.x + Vue3.x + TypeScript技术框架的H5低代码平台。它支持数据配置的导入、导出、修改和删除操作,使用的技术包括sandbox中的自定义逻辑、monaco-editor的代码补全功能以及vue3 createRenderer的自定义渲染器等,目前不过只是一个简易的模板。
您可以在GitHub上找到项目”vite-vue3-lowcode”的链接:https://github.com/buqiyuan/vite-vue3-lowcode
最新star:2158
7 shida
Shida是一个视频可视化搭建项目,开发者可以通过简单的拖拽操作即可快速创作出短视频,而且使用方式就像易企秀或百度H5等H5低代码平台一样。Shida的后端视频合成部分是基于FFCreator开发的,FFCreator是一个基于Node.js的轻量、灵活的短视频加工库,只需要添加几张图片或视频片段再加上背景音乐,就可以生成出非常酷的视频短片。
项目链接:https://github.com/tnfe/shida
最新star:363
8 quark-h5
quark-h5是一个基于Vue + Koa的前端低代码框架,其原理与大多数前端低代码框架相同:使用编辑器生成页面JSON数据,然后由服务端存储,在渲染时从服务器取出JSON数据,交给前端模板处理。
项目链接:https://github.com/huangwei9527/quark-h5
最新star:3064
9 gods-pen
码良是一个拥有 H5 页面制作、编辑、管理等功能的在线平台,可满足不同用户的制作需求:普通用户无需掌握复杂的编程技术即可通过简单的拖拽与配置制作出精美的 H5 页面,用于各类营销场景;而开发者则可以通过脚本和组件,获得强大的控制能力,实现复杂的交互行为。
项目链接:https://github.com/ymm-tech/gods-pen
最新star:4247
10 luban-h5
鲁班H5是基于Vue2.0开发的支持拖拽方式来快速生成页面的低代码平台,功能基本类似于易企秀、Maka、百度等H5平台。
项目链接:https://github.com/ly525/luban-h5
最新star:5654
11 mometa
与传统主流的低代码平台(如 amis)不同,mometa 是一款面向研发、代码可视设计编辑平台,更类似于 dreamweaver 或 GUI 的可视编辑工具,能够让我们获得所见即所得的可视编辑开发体验。
项目链接:https://github.com/imcuttle/mometa
最新star:3469
12 h5-factory
h5-factory提供了一种通过拖拽设计专题页面的可视化编辑工具,并可以一键生成html文件。
您可以在GitHub上的项目链接https://github.com/xuhaiqing/h5-factory中找到我的h5工厂。
最新star:6
13 steedos-platform
steedos-platform是一个开源的Salesforce低代码平台替代方案,它通过可视化工具模型设计、页面设计、流程设计和报表设计,使用户只需简单点击,就能快速创建应用,实现敏捷开发的新高度。在实现的技术细节上,steedos-platform利用元数据定义对象、字段、配置、代码、逻辑和页面布局,并基于这些元数据自动生成系统的数据结构,以及Steedos应用程序的用户界面和自动化逻辑。
您可以在GitHub上查看Steedos平台项目的链接:https://github.com/steedos/steedos-platform/
最新star:951
14 lz-h5-edit
通过lz-h5-edit这个H5低代码编辑平台,可以实现拖拽、缩放、旋转、动画、撤销、重做、组合元素等操作,从而实现H5页面的快速创建。
请访问GitHub上的项目链接:https://github.com/lzuntalented/lz-h5-edit,以查看lz-h5-edit项目。
最新star:462
15 tefact
通过星搭开源无代码编辑器,利用图形化界面,用户可以不用编写任何代码就能生成网站、H5和表单应用程序。
请访问GitHub上的staringos/tefact项目链接:https://github.com/staringos/tefact/
最新star:244
16 fast-poster
Fast-poster是一款基于Python和Vue技术开发的通用海报生成器,只需要简单的三步操作:启动服务 > 编辑海报 > 生成代码,就可以轻松地生成所需的海报。
项目链接:https://github.com/psoho/fast-poster
通过访问https://github.com/psoho/fast-poster,你可以获取有关psoho/fast-poster项目的更多信息。
最新star:408
17 openDataVizualization
OpenDataV是一款利用Vue3+vite+TypeScript开发的前端可视化低代码平台。它支持拖拽、可视化、低代码方式开发,可以让您自由组合成酷炫的大屏,并且支持将开发者自己开发的组件集成到平台中。
可以在GitHub上找到AnsGoo的开放数据可视化项目,它的链接为https://github.com/AnsGoo/openDataV。
最新star:196
18 mall-cookies
Mall-Cook 是一个基于 vue 开发的可视化商城搭建平台,它具有多页面可视化构建、Json Schema 生成器(可视化搭建物料控制面板),实现组件流水线式标准接入平台的功能。最新版本采用 uni-app 重构物料、模板项目,使得它不仅支持生成 H5、小程序多端商城,而且还具有更强大的功能。
可以通过以下GitHub链接访问我的项目“mall-cook-book”:https://github.com/wangyuan389/mall-cook-book
最新star:3632
19 form-generator
Form-Generator是一个基于Element UI的表单设计及代码生成器,可以直接将生成的代码运行在基于Element的Vue项目中,也可以将表单转化为JSON格式,并使用相应的解析器将其解析为真实的表单。
项目链接:https://github.com/JakHuang/form-generator
这是一个由JakHuang创建的Github项目“form-generator”的链接。
最新star:7482
20 vjdesign
Vjdesign是一款可以为任何vue项目提供组件定义的设计器,它不需要二次开发就可以定义和配置组件的属性、组件与数据的关系以及表单的交互行为。
以下是我GitHub上的项目链接:https://github.com/fyl080801/vjdesign
最新star:384