AppBoxFuture(低代码快速开发框架): Hello Future!（低代码开源框架）

AppBoxFuture是一个低代码快速应用框架(Rapid Application Framework)，是作者十几年从事信息化建设的经验结晶。框架具备以下一些特色：

• 极简的分布式系统架构:

根据需要可单节点或集群部署，如下图所示：

• 模型驱动开发(MDD):

框架将应用系统所涉及的数据结构、业务逻辑、用户界面、工作流、报表、权限等抽象为各类型的模型，通过组合模型以形成完整的应用系统，通过调整模型以适应业务的需求变更。由于模型具备抽象性开发人员可以快速根据业务需求构建相应的模型；由于模型具备规范性约束，可以有效的保障不同技能的开发人员开发出高质量的系统；由于模型具备关联性约束，可以有效的保障调整模型时不引入新的缺陷。

• 集成强一致性数据存储：

框架基于Raft及RocksDB实现了分布式强一致性的存储引擎，由于分布式存储天生的特性，随着数据量的不断增长可以通过低成本的方式横向扩展（Scaleout）节点，并且在集群的多数派节点存活的条件下可保障系统连续不间断运行。

目前框架还在开发过程中，现就已完成的部分做一个技术预览，让我们开始体验吧：

安装与启动：

注意：目前仅支持Ubuntu18.04

安装依赖包

$> sudo apt install libjemalloc ragel libhwloc libnuma libpciaccess libcrypto libboost-all libxml2 xfslibs libgnutls28 liblz4 libsctp systemtap-sdt libyaml-cpp libc-ares

安装运行时

$> git clone https://github.com/enjoycode/appbox.deploy.git

启动集群的第一个节点

$> sudo ./appbox –init=10.211.55.10:9000 –peer=1.1.1

–init 指明初始化集群的第一个节点，请修改为本机地址；

–peer 指明本节点的编号, [数据中心编号].[机架编号].[机器编号]

开发体验

打开浏览器（建议新版Chrome)，输入http://10.211.55.10:5000/dev/index.html

出现登录界面，输入用户名：Admin，密码：760wb,登录后跳转至框架集成开发环境界面。

实体模型（EntityModel对应数据结构)

暂用系统内置的员工模型作为示例（注意：Account成员上有惟一索引）。

服务模型（ServiceModel对应业务逻辑）

在左侧模型树内选择Services节点，点击主菜单“New->Service”，弹出新建对话框输入服务名称：EmpService后点击OK,然后从左侧模型树内展开并选择新建的EmpService,出现服务模型编辑界面,输入以下示例服务代码：

注意：服务代码编辑时有智能提示，在IDE底部的\”Problems\”会提示代码错误

using System;using System.Threading.Tasks;namespace sys.ServiceLogic{ public class EmpService { public async Task<Entities.Emploee[]> GetAll(string name) { var q = new TableScan<Entities.Emploee>(); if (!string.IsNullOrEmpty(name)) q.Filter(t => t.Name == name); return await q.ToListAsync(); } }}

点击主菜单“Save”保存，并点击主菜单“Publish”弹出发布对话框，点击Ok将变更的模型发布至运行时。此时框架会将虚拟的业务逻辑代码编译转换为运行时代码，并由运行时容器管理。

视图模型（ViewModel对应用户界面）

在左侧模型树内选择Views节点，点击主菜单“New->View\”，弹出新建对话框输入视衅名称：EmpList后点击OK,然后从左侧模型树内展开并选择新建的EmpList，出现视图模型编辑界面，输入以下示例代码：

注意：视图模型包括模版(Template)、脚本(Script)及样式(Style)代码，另点击\”Preview\”可展开实时预览界面。

• 模版示例代码：

<div> <e-button-group> <e-button type=\”primary\” icon=\”fas fa-plus-circle\”> 新建</e-button> <e-button type=\”primary\” icon=\”fas fa-search\” @click=\”loadData\”> 查找</e-button> </e-button-group> <e-input v-model=\”qname\” placeholder=\”查询关键词\” icon=\”search\” style=\”width:150px\” size=\”small\”> </e-input> <e-table :data=\”emps\” border highlight-current-row> <e-table-column prop=\”Name\” label=\”名称\” width=\”220\”> </e-table-column> <e-table-column prop=\”Account\” label=\”帐号\”> </e-table-column> </e-table></div>

• 脚本示例代码

@Componentexport default class EmpList extends Vue { qname: string //查询关键词 emps = [] //员工列表 // 调用服务加载员工列表 loadData() { sys.Services.EmpService.GetAll(this.qname).then(res => { this.emps = res }).catch(err => { this.$message.error(\’加载失败\’) }) }}

此时在预览界面点击“查找”按钮，即可看到列表结果，在“查询关键词”输入“Admin“即可过滤。

小结

本篇主要体验框架的集成开发环境如何快速开发一个列表视图，并绑定调用相应的业务服务，下篇“Say goodbye to Sql“将介绍框架集成的强一致性分布式存储。如果您有问题或Bug报告，请留言或在https://github.com/enjoycode/appbox.deploy提交Issue。