AppBoxFuture(一): Hello Future!

  AppBoxFuture是一個快速應用框架(Rapid Application Framework)，是作者十幾年從事信息化建設的經驗結晶。框架具備以下一些特色：

1. 極簡的分布式系統架構
   根據需要可單節點或集群部署，如下圖所示：
   

2. 模型驅動開發（MDD）：

   框架將應用系統所涉及的數據結構、業務邏輯、用戶界面、工作流、報表、權限等抽象為各類型的模型，通過組合模型以形成完整的應用系統，通過調整模型以適應業務的需求變更。由於模型具備抽象性開發人員可以快速根據業務需求構建相應的模型；由於模型具備規范性約束，可以有效的保障不同技能的開發人員開發出高質量的系統；由於模型具備關聯性約束，可以有效的保障調整模型時不引入新的缺陷。

3. 集成強一致性數據存儲：

   框架基於Raft及RocksDB實現了分布式強一致性的存儲引擎，由於分布式存儲天生的特性，隨着數據量的不斷增長可以通過低成本的方式橫向擴展（Scaleout）節點，並且在集群的多數派節點存活的條件下可保障系統連續不間斷運行。

目前框架還在開發過程中，現就已完成的部分做一個技術預覽，讓我們開始體驗吧：

安裝與啟動：

注意：目前僅支持Ubuntu18.04

安裝依賴包

$>sudo apt install libsnappy1v5 libcrypto++6 libgnutlsxx28 libxml2 libnuma1 libhwloc5 libc-ares2 libatomic1 libunistring2

安裝運行時

$> 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>
	<el-button-group>
		<el-button type="primary" icon="fas fa-plus-circle"> 新建</el-button>
		<el-button type="primary" icon="fas fa-search" @click="loadData"> 查找</el-button>
	</el-button-group>
	<el-input v-model="qname" placeholder="查詢關鍵詞" icon="search" style="width:150px" size="small">
	</el-input>

	<el-table :data="emps" border highlight-current-row>
		<el-table-column prop="Name" label="名稱" width="220">
		</el-table-column>
		<el-table-column prop="Account" label="帳號">
		</el-table-column>
	</el-table>
</div>

腳本示例代碼

@Component
export 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“將介紹框架集成的強一致性分布式存儲。
目前作者想尋志同道合者（前端ts, vue, 后端c++ c# rocksdb)來共同完成它，如有意向或問題請發郵件聯系[e-mail]