原副标题:百度低标识符网络平台正式宣布开放源码!可拖曳聚合智能手机、PC等工程项目!接挨揍搞出来~
源自社会公众号: 百度开放源码
工程项目概要
百度tmagic-editor是两个所见即所得的网页建模GUI,如前所述tmagic-editor可以加速构筑建模网页制造网络平台,让非技工能透过拖曳和实用性,自助式聚合H5网页、PC网页、TV网页,大大增加网页制造成本,同时实现零标识符/低标识符聚合网页。
下列是百度音频团体会员销售业务如前所述tmagic-editor构筑的建模网页构筑网络平台左图。tmagic-editor早已用作百度音频团体会员、爱打游戏、云影音北极星、百度全会等十数个百度销售业务,每星期制造和正式发布数十个网页。
如前所述建模GUI的网页制造工艺
一、电子零件合作开发,主要就是指销售业务模块,比如说相片模块、抽奖活动模块、登入应用程序等。tmagic-editor这类并不提供更多销售业务模块,销售业务模块由采用tmagic-editor的销售业务,依照他们的销售业务市场需求去另行合作开发。销售业务模块一场合作开发,在数个网页反反复复采用,销售业务模块如果提供更多许多实用性快捷键,确保稳定性,满足用户相同网页采用该模块时的订制市场需求。销售业务模块能用相同的后端架构同时实现,如vue2、vue3、react。
二、编排,这里指透过对模块的拖曳和配置,完成网页编辑,主要就由非技工完成。
三、保存与正式发布,这个环节在技术同时实现上,分为聚合DSL、构建、部署。聚合DSL:GUI和聚合的网页之间,透过DSL解耦。GUI上实用性网页,得到的产物是两个序列化js对象的网页描述文件,这个对象采用js schema描述,描述网页的基本信息、包含的模块信息、以及模块间逻辑。构建:构建模块如前所述runtime标识符,对模块进行打包构建,聚合html、js、css文件。构建环节采用的runtime能依照销售业务的需要,选择相同的后端架构同时实现,tmagic-editor默认提供更多了vue2、vue3、react三种runtime。部署:将前面环节聚合的html、js、css、js schema描述文件,部署到销售业务他们的服务器上。
tmagic-editor提供更多了什么
建模GUI
如上图所示,就是tmagic-editor建模GUI,tmagic-editor如前所述vue3同时实现。包括左侧侧边栏、模块列表展示、已选模块的模块树、中间的网页拖曳的画布区域(也叫模拟器)、右侧表单实用性区域、正中间上方的画布控制区域(放大缩小、网格线显隐)、预览、保存、查看源码(js schema描述的js对象)、底部区域的网页添加与删除。GUI具有扩展功能,销售业务能依照需要在侧边栏和顶部栏增加版本管理、正式发布等功能。
runtime
r untime 的概念,是理解tmagic-editor网页运行的重要概念,runtime 是承载tmagic-editor网页的运行环境。建模网页需要在tmagic-editorGUI中构筑、渲染,透过模拟器所见即所得。构筑完成后,保存实用性并正式发布,然后渲染成用户访问的真实网页。其中涉及到两个相同的 runtime:GUI中的模拟器,终端打开真实网页。
由于tmagic-editor在GUI中的模拟器是透过 iframe 渲染的,和tmagic-editor网络平台这类能做到架构解耦,所以 runtime 也能用相同架构合作开发。目前tmagic-editor提供更多了 vue2/vue3 和 react 的 runtime 。
各个 runtime 的作用除了作为相同场景下的渲染环境,同时也是相同环境的打包构建载体。tmagic-editor示例标识符中的打包就是如前所述 runtime 进行的。
管理端demo
GUI能对两个网页进行编辑、实用性、正式发布,我们还需要一个管理端来对网页列表进行管理。我们提供更多了两个管理端demo,方便销售业务加速构筑起两个完整的建模构筑网络平台。管理端提供更多了如下能力:
网页列表展示,查询 网页创建,复制 网页编辑以及 AB TEST 实用性能力 网页正式发布以及正式发布状态查看和管理采用tmagic-editor的销售业务需要做什么
合作开发销售业务模块
tmagic-editor并不提供更多销售业务模块,销售业务需要依照他们的销售业务场景,合作开发相应的销售业务模块。比如说抽奖活动模块、音频播放模块等。tmagic-editor的通用性设计,使得销售业务方能采用相同的后端架构去合作开发模块。tmagic-editor官方早已提供更多了vue2/vue3、react的runtime,意味着销售业务能直接采用这些架构合作开发模块,如果销售业务想用其它架构合作开发模块,则需要合作开发相应的runtime。
合作开发销售业务应用程序(可选)
应用程序的功能是作为网页逻辑行为的一种补充方式。一般不显式的在模拟器中被渲染出具体内容(除非应用程序中会聚合模块并插入网页),通常我们会用应用程序同时实现类似登入,网页环境判断,请求拦截器等功能。跟模块一样,能用相同后端架构同时实现。
部署建模构筑服务
tmagic-editor提供更多的是开源标识符,并不是两个saas服务,因此销售业务需要他们部署建模构筑网络平台的服务。
构建和正式发布网页
销售业务需要管理他们的模块库,在正式发布环节如前所述拿到的网页js Schema描述文件,如前所述runtime进行打包构建,并把打包构建的产物部署到他们的服务器/CDN。
其它订制市场需求
如果对GUI有许多扩展市场需求,GUI早已预留了相应的扩展能力,销售业务能合作开发相应扩展功能。tmagic-editor提供更多了vue2/vue3、react的runtime,销售业务能修改runtime,或者合作开发其它后端架构的runtime。
tmagic-editor能力项
如何了解tmagic-editor
开放源码地址:https://github.com/Tencent/tmagic-editor 在线文档:https://tencent.github.io/tmagic-editor/docs/ 在线体验:https://tencent.github.io/tmagic-editor/playground/index.html#/— EOF —
推荐↓↓↓