一文讲透 CabloyJS 全栈框架的来龙去脉

[zhennann]

本文受众

咱们做软件开发，就好比是建造一幢幢房屋，一座座桥梁，既可以是北方宫殿的巍峨，也可以有南方庭院的雅致，更可以是横跨群山的峻险与孤悬。那么，不同的语言、不同的框架也都由其内在的秉质吸引着一批粉丝，坚持不懈的耕耘，营造出不同的生态，呈现出不同的开发风格和开发体验。正如Rails 之于 Ruby，Lavaral 之于 PHP，Django 之于 Python，Spring Boot 之于 Java。那么，又是什么之于 Javascript 呢？毋庸置疑，Javascript 面对着更多的使用场景，前端、后端、移动端、IOT ，等等。不同的场景都有出色的解决方案存在。而且，基于不同的使用偏好，又分裂出 Javascript 和 Typescript 两个风格体系。那么，基于业务开发而言，就目前的 Node 生态可以说，Nest 之于 Typescript，Cabloy 之于 Javascript

正因为面对业务开发，不同的语言、不同的框架，会有不同的解决方案和风格体验。因此，不论您使用 CabloyJS 或者不使用 CabloyJS ，都有必要进来看看在坚守原生 Javascript（ Vanilla JS ）的土壤上，可以开出怎样的花朵。因此，不论您是前端开发、后端开发、全栈开发，或者其他语言的粉丝，或者技术经理、产品经理、项目经理，都可以从 CabloyJS 提供的文档和视频中汲取不一样的解题思路和方法，相互交流，相互借鉴，共同进步！

在英语语境中，原生 Javascript 有一个专属名称：Vanilla JS 。而 Vanilla 有香草🌿之意，看来所言不虚

语言	框架
Ruby	Rails
PHP	Lavaral
Python	Django
Java	Spring Boot
Typescript	Nest
Javascript	Cabloy

CabloyJS 是什么

CabloyJS 是一款自带工作流引擎的 Node.js 全栈框架，一款面向开发者的低代码开发平台，更是一款兼具低代码的开箱即用和专业代码的灵活定制的 PAAS 平台。只需一套代码，即可同时实现中后台管理系统和前台应用。只需一套代码，即可同时跨端pc和mobile，并且mobile 端是接近原生体验

CabloyJS 内置的每一项特性都做到精心调校，均体现了从开箱即用到灵活定制的无缝衔接，包括：角色系统、用户认证、菜单权限、数据权限、表单渲染、表单验证、工作流引擎、字典、仪表板、在线推送、页面主题、多语言国际化、CMS 渲染引擎、微信接口、企业微信接口、钉钉接口，等等

技术栈

场景	技术栈
前端	vue2 + framework7
后端	koa2 + egg2
数据库	mysql
分布式（缓存 /队列 /消息）	redis 、bullmq 、websocket
Markdown 富文本编辑	Prosemirror

在线演示

CabloyJS 提供了大量在线演示：

1. 演示如何在一套代码中同时开发B 端中后台管理系统和C 端前台应用

2. 演示如何在一套代码中同时跨端pc和mobile，并且mobile 端是接近原生体验

因此，强烈建议您移步查看：在线演示

引言

凡是可以用 JavaScript 来写的应用，最终都会用 JavaScript 来写 | Atwood 定律

目前市面上出现的大多数与 NodeJS 相关的框架，基本都将 NodeJS 定位在工具层、聚合层、中间层、代理层，很少在业务层面进行深耕，认为这是 JAVA 的领域，NodeJS 不适合。这种思潮明显是与Atwood 定律相悖的

如果您想感受不同的 NodeJS 全栈开发体验，一定要试试自带工作流引擎的 CabloyJS 全栈开源框架。为了提升业务层面的开发效率和开发体验，CabloyJS 在前端和后端均提供了大量实用的工具和组件

CabloyJS 解决了哪些现实痛点问题？

在 NodeJS 开发领域，目前(截止 2022 年 11 月)存在以下几个痛点问题：

1. 中后台管理系统如何更优雅的支持移动端？

随着移动终端的普及和升级换代，大量业务场景都需要移动端的支持，比如管理层需要通过手机查看统计数据、审核业务单据；运维人员通过手机远程查看服务器状态，并进行调整优化

我们知道，市面上大多数中后台管理系统，都是优先适配 PC 端，然而移动端体验却不佳，处于勉强可用，但不好用的阶段

此外，大多数XXX Admin 框架和中后台管理框架其本质是代码模版。在具体开发项目时，直接在代码模版中编写代码。这样，虽然修改起来很直接，但是不利于模版的持续升级和优化；也不利于业务代码的持续沉淀和迁移（至其他项目）。因此，当把代码模版从源码仓库下载下来之后，修改三分之一，增加三分之一，删减三分之一，从此就与代码模版的后续升级版本绝缘了

2. NodeJS 领域没有好用的工作流引擎！

如果单说 CRUD ，大多数编程语言的开发框架都可以轻松实现，这不应该成为 NodeJS 开发业务系统的核心优势。若要让 NodeJS 深入业务领域的开发，工作流引擎是一个绕不过去的核心组件

3. 拖拽式低代码平台已经成为鸡肋方案！

大多数业务表单不仅仅是一些字段的简单组合和增删改查，不同的业务都有自己独特的业务诉求，往往需要前端界面的定制和后端逻辑的定制。拖拽式低代码平台，对于业务人员而言没有足够的工具进行深入定制，对于研发人员而言也没有足够的机制深入开发

许多拖拽式低代码平台认识到了这一点，所以针对不同的业务场景提供官方预配置的套装解决方案，这同样也把业务人员和研发人员置于不上不下的尴尬境地，成为食之无味 弃之可惜的鸡肋平台

CabloyJS 亮点介绍

基于上述分析的问题，CabloyJS 实现了如下功能三大亮点和架构三大亮点

1. 功能三大亮点

1 ）自适应布局：pc = mobile + pad

CabloyJS 首创独树一帜的pc = mobile + pad跨端自适应布局机制：只需要一套代码，就可以同时兼容mobile 端和pc 端。mobile 端达到原生效果，同时将mobile 端的操控体验和开发模式无缝带入pc 端

请大家分别在 PC 端和手机端打开演示链接: https://test.cabloy.com/ ，来体会与众不同的自适应机制

2 ）基于 JSON Schema 的表单自动渲染与数据验证引擎

通过在一处定义JSON Schema，就可以同时支持前端的表单自动渲染和后端的数据验证，既能开箱即用又可灵活定制

3 ）内置 NodeJS 工作流引擎

CabloyJS 充分利用 JS 语言的灵活性和 JSON 格式的便捷性，提供的 NodeJS 工作流引擎远比 JAVA 领域的Activiti 简洁易用

比如，我们一般只知道如何使用Activiti中提供的活动节点和边界事件，却很少有途径来了解如何开发自定义的活动节点和自定义的边界事件。由于Activiti的架构繁杂，大多数人甚至不愿意尝试去阅读源码。但是 CabloyJS 提供的工作流引擎却可以轻松的定制所有的工作流元素，而且源码层次清晰，易于学习

2. 架构三大亮点

作为一款面向开发者的低代码开发平台，为了将低代码的开箱即用和专业代码的灵活定制有机融合，CabloyJS 在架构层面主要做了以下几点：

1 ）模块化开发体系与模块隔离

为了满足大型业务系统开发的诉求，CabloyJS 采用模块思维规划系统架构，以业务功能为单位（比如出差申请），将与业务功能相关的前端组件与后端逻辑组织为一个业务模块，从而有利于业务功能的内聚与重用，也有利于以业务为单位进行团队分工

此外，业务模块内部的页面、数据、逻辑、路由、配置等元素均进行了命名空间隔离处理，从而避免模块之间的变量污染与冲突。换句话说，当我们在自己的业务模块中为某个资源命名时，不用担心其他业务模块是否存在相同名称的资源，从而减少心智负担

2 ）原生分布式架构

EggJS 的定位是框架的框架，CabloyJS 后端在 EggJS 的基础上采用自定义 Loader机制扩展出来了一套适配业务场景的新特性

比如，EggJS 原有的Worker + Agent进程模型，对于单机而言非常便利。但是面对多机集群，特别是基于docker的集群部署而言，Agent 进程就失去了用武之地。更重要的是，如果一开始基于Agent 进程进行开发，后续很难平滑的过渡到分布式场景。因此，CabloyJS 后端采用Redis，从框架底层就开始原生分布式的架构设计，并衍生出了Broadcast 、Queue 、Schedule 、Startup等一系列分布式的开发组件，方便我们从一开始就进行分布式的开发。因此当系统起量后，可以轻松做集群扩展，参见：Broadcast, Queue, Schedule, Startup

3 ）前后端分离，全平台跨端开发

通过前后端分离的架构设计，只需要一套代码就可以支持全平台业务的跨端开发，包括B 端后台管理应用和C 端前台应用

平台	前端	后端
PC：Web	CabloyJS 前端	CabloyJS 后端
PC：Exe	CabloyJS 前端 + Electron	CabloyJS 后端
Mobile：IOS	CabloyJS 前端 + Cordova	CabloyJS 后端
Mobile：Android	CabloyJS 前端 + Cordova	CabloyJS 后端
微信公众号	CabloyJS 前端 + 微信 API	CabloyJS 后端
企业微信	CabloyJS 前端 + 企业微信 API	CabloyJS 后端
钉钉	CabloyJS 前端 + 钉钉 API	CabloyJS 后端
Slack	CabloyJS 前端 + Slack API	CabloyJS 后端
小程序：微信、支付宝等	Uni-app + CabloyJS 前端 SDK	CabloyJS 后端

• 后端：由于完整的前后端分离设计，只需开发一套 CabloyJS 后端代码即可
• 前端：所有可基于 H5 的场景，只需开发一套 CabloyJS 前端代码即可
• 小程序：提供 CabloyJS 前端 SDK 让 Uni-app 可以轻松对接 CabloyJS 后端代码

CabloyJS 可以开发什么系统

1. 可以开发多租户 SAAS 业务系统
2. 可以开发前后端分离的后台业务管理系统，如 OA 、CRM 、ERP 、电商，等等
3. 可以开发JAMStack架构的CMS 内容管理系统，支持 SEO 优化，如博客、技术文档、社区、知识店铺，等等
4. 既可以先开发后台业务管理系统，再延伸开发CMS 内容管理系统；也可以反过来，先开发CMS 内容管理系统，再延伸开发后台业务管理系统
5. 可以通过Cordova开发各类 App 应用，支持 IOS 、Android
6. 可以通过Electron开发桌面应用
7. 可以开发微信公众号、企业微信、钉钉，等第三方平台的应用，解决信息孤岛的问题
8. 可以为Uniapp 小程序开发后端 API 接口

CabloyJS 的研发历程

CabloyJS 从 2016 年启动开发，主要历经两个研发阶段：

1. 第一阶段：EggBornJS

EggBornJS 关注的核心就是模块化体系与模块隔离，并以此实现一套完整的全栈开发框架

比如模块egg-born-front是框架前端的核心模块，模块egg-born-backend是框架后端的核心模块，模块egg-born是框架的命令行工具，用于创建项目骨架

这也是为什么所有业务模块都是以egg-born-module-为命名前缀的原因

2. 第二阶段：CabloyJS

EggBornJS 只是一个基础的全栈开发框架，如果要支持业务的快速开发，还需要考虑许多与业务相关的支撑特性，如：工作流引擎、用户管理、角色管理、权限管理、菜单管理、参数设置管理、表单验证、登录机制，等等。特别是在前后端分离的场景下，对权限管理的要求就提升到一个更高的水平

CabloyJS 在 EggBornJS 的基础上，提供了一套核心业务模块，从而实现了一系列业务支撑特性，并将这些特性进行有机的组合，形成完整而灵活的上层生态架构，从而支持具体的业务开发进程

有了 EggBornJS ，从此可复用的不仅仅是组件，还有业务模块

有了 CabloyJS ，您就可以快速开发各类业务应用

信念

凡是可以用 JavaScript 来写的应用，最终都会用 JavaScript 来写 | Atwood 定律

相信，Javascript 的深度探索者都会被这句名言激发，共同努力，为 Javascript 生态添砖加瓦，构建更繁荣的应用生态

CabloyJS 正是对这一名言的探索之作。欢迎您也加入 CabloyJS 的社区生态，一起促进 Javascript 的繁荣与应用

名称的由来

1. EggBorn

这个名称的由来比较简单，因为有了 Egg(后端框架)，所以就有了 EggBorn 。有一部动画片叫《天书奇谭》，里面的萌主就叫“蛋生”，我很喜欢看（不小心暴露了年龄😅）

2. Cabloy

Cabloy 来自蓝精灵的魔法咒语，拼对了 Cabloy 这个单词就会有神奇的效果。同样，CabloyJS 是有关化学的魔法，基于模块的组合与生化反应，您将实现您想要的任何东西

License

MIT ，免费商用

[mlhadoop]

不要再卷了，学不动

[shanyuhai123]

打磨下 UI 和交互吧，点进去三秒钟就不想看了。。。

[Asimov01]

感觉需要一些设计师 😂

[ainon]

框架也是轮子

[ForkGagHub]

擦 我看成了拔龙脉。。。

[ck65]

这是啥高考文风？

[horizon]

不错，扩展了我的后端视野

[zhennann]

@mlhadoop 可以理解。不过我这不是刻意卷。如果说反复的造轮子，一个茴字换好几种写法，可以称之为卷。但是，咱们可以回想一下，NodeJS 生态中有好用的工作流引擎吗？咱们用了那么多框架，真的实现了“开发一次，到处运行”的梦想了吗？这就是坚持做 CabloyJS 的初衷。当然，CabloyJS 提供的细节还有很多，都是“想要而没有的”特性。

[zhennann]

@ck65 高考作文太难了，只能分享一下最近写的小诗：风雨纵横至，岁月辗转来。浊酒二三两，心花淡淡开。还有几首，可以加微信：yangjian2025

[hihanley]

很牛

[himeson]

支持