Tango 是一个用于快速构建低代码平台的低代码设计器框架，借助 Tango 只需要数行代码就可以完成一个基本的低代码平台前端系统的搭建。Tango 低代码设计器直接读取前端项目的源代码，并以源代码为中心，执行和渲染前端视图，并为用户提供低代码可视化搭建能力，用户的搭建操作会转为对代码的修改。借助 Tango 可以实现 源码进，源码出的效果。
引擎架构概览
Tango 低代码引擎在实现上进行了分层解藕，使得上层的低代码平台与底层的低代码引擎可以独立开发和维护，快速集成部署。另一方面，Tango 低代码引擎定义了一套开放的物料生态体系，开发者可以自由的贡献扩展组件配置能力的属性设置器，以及扩展低代码物料的二方三方业务组件。
如下图所示：
引擎设计器构成概览
Tango 低代码引擎设计器用于低成本初始化一个基本的低代码平台，其前端部分主要包括如下几个部分：
-
设计器主框架：进行外框架初始化，状态管理，拖拽引擎绑定等核心逻辑。 -
侧边栏面板：提供可扩展的侧边面板，除了内置通用的面板，用户还可以任意添加自定义的面板。
-
属性设置面板：属性设置器面板，支持用户进行属性配置。
-
运行时沙箱：用于设计器运行时视图的渲染。
-
Web IDE：用于进行在线源代码编辑。
基于源代码的引擎内核
源码进，源码出
官方文档站点: https://netease.github.io/tango/
演示应用: https://tango-demo.musicfe.com/designer/
代码地址:https://github.com/NetEase/tango.git
经历网易云音乐内网生产环境的实际检验，可灵活集成应用于低代码平台，本地开发工具等； 基于源码 AST 驱动，无私有 DSL 和协议； 提供实时出码能力，支持源码进，源码出； 开箱即用的前端低代码设计器，提供灵活易用的设计器 React 组件； 使用 TypeScript 开发，提供完整的类型定义文件。
现代浏览器（Chrome >= 80, Edge >= 80, last 2 safari versions, last 2 firefox versions）
2023.08.30 开源仓库和文档站点上线，发布 alpha 演示版本。 2023.09.30 核心 API 面向社区场景重构和优化，发布 Beta 测试版本。 2023.10.30 核心 API 基本稳定，不再发生 BR，发布 1.0 RC 版本。 API 完全稳定，提供良好的社区支持，可用于生产环境。
如何使用
npm install @music163/tango-designer初始化设计器内核 import { createEngine } form '@music163/tango-designer';// 引擎初始化const engine = createEngine({entry: '/src/index.js',files: sampleFiles,componentPrototypes: prototypes as any,});初始化拖拽引擎 import { DndQuery } form '@music163/tango-designer';const sandboxQuery = new DndQuery({context: 'iframe',});设计器框架初始化(WIP)详细使用方法请参考使用文档。
开发
推荐开发环境
Node.js >= 16.0.0 Yarn >= 1.22.0 本地开发调试方法 # 下载仓库
git clone https://github.com/NetEase/tango.git
# 进入项目根目录
cd tango
# 安装依赖
yarn
# 启动设计器示例
yarn start文章信息来源：自学编程之道、网易云音乐技术团队 如有侵权，请联系删除。
- END -
报告下载
大佬观点
西门子低代码-王炯 | 西门子低代码-阮铭 | 微软-李威 | 微软-徐玉涛 | 葡萄城-李佳佳 | 葡萄城-宁伟 | SAP-陈泽平 | 华为-周明旺 | 华为云-董鑫武 | 钉钉宜搭-邵磊 | 轻流-严琦东 | 腾讯云微搭-骆勤 | 网易数帆-陈谔、严跃杰 | 百特搭-姜楠 用友-刘鑫 | 数睿数据-张超 | 奥哲-朱鹏喜 | 炎黄盈动-汤武 | 普元信息-孟庆余 | 得帆-李健达 | 瀚码技术-钟惟渊 | iVX-孟智平 Treelab-何浚炫 | 阿里-汪凤震 | 明道云-薛晨 | 上海斯歌-傅正斌
公众号后台回复【加群】 可受邀进入【无代码&低代码技术应用研讨群】 欢迎各位从业者/应用者/关注者加入
