Cabloy.js：基於EggBorn.js開發的一款頂級Javascript全棧業務開發框架

文檔

• 官網 && 文檔

演示

• PC：https://admin.cabloy.com
• Mobile：

EggBorn.js是什麼

EggBorn.js是一款頂級Javascript全棧開發框架。前端採用Vue.js + Framework7 + Webpack，後端採用Koa.js + Egg.js，數據庫採用mysql。
EggBorn.js在縱向上，將前端和後端打通，造成一個有機的總體，避免前端和後端各自爲政的情況；
EggBorn.js在橫向上，提煉出「業務模塊化」的代碼組織模式，經過不一樣的模塊組合實現業務開發，也爲大型Web應用不斷增加的業務需求提供有力的基礎架構。

再談Cabloy.js

EggBorn.js只是一個基礎的全棧開發框架，若是要進行業務開發，還須要考慮許多與業務相關的支撐特性，如：用戶管理、角色管理、權限管理、菜單管理、參數設置管理、表單驗證、登陸機制，等等。特別是在先後端分離的場景下，對權限管理的要求就提高到一個更高的水平。
Cabloy.js在EggBorn.js的基礎上，經過「業務模塊」的方式，實現一系列支持特性，並將這些特性進行有機的組合，造成完整而靈活的上層生態架構，從而支持具體的業務開發進程。

Cabloy.js架構圖

先決條件

凡是能夠用 JavaScript 來寫的應用，最終都會用 JavaScript 來寫。 ——Atwood定律

相信，Javascript的深度探索者都會被這句名言激發，共同努力，爲Javascript生態添磚加瓦，構建更繁榮的應用生態。
Cabloy.js正是對這一名言的探索之做。Cabloy.js不重複造輪子，而是採用業界最新的開源技術，進行全棧開發的最佳組合。所以，也深度建議您在繼續後面的閱讀以前，最好能對如下框架有所瞭解和認知。

• 前端

  • Vue.js
  • Framework7
  • Webpack

• 後端

  • koa.js
  • Egg.js
  • EggBorn.js

Cabloy名字的由來

Cabloy來自藍精靈的魔法咒語，拼對了Cabloy這個單詞就會有神奇的效果。一樣，Cabloy.js是有關化學的魔法，基於原子的組合與生化反應，您將實現您想要的任何東西。

Cabloy特性

• 統一的原子數據管理
• 統一的用戶角色權限管理
• 對多種運行環境的精細支持
• 支持多域名多實例運行
• 靈活的測試驅動開發
• 內置衆多核心模塊，提供大量核心特性

有了Cabloy.js，您就能夠快速開發各種業務應用。

EggBorn特性

• 先後端分離：先後端分離開發，深度解耦
• 業務模塊化：頁面組件按模塊組織
• 加載方式靈活：模塊既可異步加載，也可同步加載
• 模塊高度內聚：模塊包括前端頁面組件和後端業務邏輯
• 參數配置靈活：模塊中的先後端能夠單獨進行參數配置
• 國際化：模塊中的先後端均支持獨立的國際化
• 模塊隔離：模塊的頁面、數據、邏輯、路由、配置等元素均進行了命名空間隔離處理，避免模塊之間的變量污染與衝突
• 超級易用的事務處理：只需在路由記錄上配置一個參數，便可完美實現數據庫的事務處理。
• 漸進式開發：因爲模塊的高度內聚，能夠將業務以模塊的形式沉澱，在多個項目中重複使用，既可貢獻到npm開源社區，也可部署到公司內部私有npm倉庫。

有了EggBorn.js，今後可複用的不單單是組件，還有業務模塊。

快速開始

安裝

$ npm install -g egg-born

新建項目

$ egg-born cabloy-demo --type=cabloy
$ cd cabloy-demo
$ npm i

配置MySQL

src/backend/config/config.unittest.js

// mysql
  config.mysql = {
    clients: {
      // donnot change the name
      __ebdb: {
        host: '127.0.0.1',
        port: '3306',
        user: 'root',
        password: '',
        database: 'sys',
      },
    },
  };

src/backend/config/config.local.js

// mysql
  config.mysql = {
    clients: {
      // donnot change the name
      __ebdb: {
        host: '127.0.0.1',
        port: '3306',
        user: 'root',
        password: '',
        database: 'sys',
      },
    },
  };

src/backend/config/config.prod.js

// mysql
  config.mysql = {
    clients: {
      // donnot change the name
      __ebdb: {
        host: '127.0.0.1',
        port: '3306',
        user: 'root', // 'travis',
        password: '',
        database: '{{name}}',
      },
    },
  };

測試

$ npm run test:backend

運行

啓動後端服務

$ npm run dev:backend

啓動前端服務

$ npm run dev:front

GitHub貢獻

有任何疑問，歡迎提交 issue！