一种基于可视化拖拽编排的前端低代码系统的制作方法

1.本发明属于程序开发技术领域，涉及一种前端低代码系统，特别是一种基于可视化拖拽编排的前端低代码系统。


背景技术：

2.低代码是一种可视化的应用开发方法，用较少的代码、以较快的速度来交付应用程序，将程序员不想开发的代码做到自动化，称之为低代码。
3.低代码是一组数字技术工具平台，基于图形化拖拽、参数化配置等更为高效的方式，实现快速构建、数据编排、连接生态、中台服务。通过少量代码或不用代码实现数字化转型中的场景应用创新。它能缓解甚至解决庞大的市场需求与传统的开发生产力引发的供需关系矛盾问题，是数字化转型过程中降本增效趋势下的产物。
4.现今企业都有着数字化转型的迫切需求，而程序相关从业人员并不能满足要求，导致开发成本高，开发时间、交付时间延长成为了常态。
5.在当前的低代码开发过程中，虽然针对多种功能设置有相应的低代码组件，但是不具备系统能力且缺乏网络安全相关业务能力，导致使用者无法在短时间内搭建所需应用。


技术实现要素：

6.本发明的目的是针对现有的技术存在上述问题，提出了一种基于可视化拖拽编排的前端低代码系统，本发明具有系统化构建安全应用的能力。
7.本发明的目的可通过下列技术方案来实现：
8.一种基于可视化拖拽编排的前端低代码系统，包括前端架构层和后端架构层，其特征在于：
9.所述前端架构层从下至上依次包括network、工具类、页面容器、打包编译、功能模块、浏览器、应用场景；
10.所述后端架构层从下至上依次包括基础设施、数据库、数据层、功能模块、api。
11.一种基于可视化拖拽编排的前端低代码系统的使用方法，其特征在于，该使用方法包括如下步骤：
12.步骤一：登录前端低代码系统，系统会根据账号分配对应权限；
13.步骤二：进入可视化配置功能页面，配置页面主要包含左(组件菜单)、中(可视化配置区域)、右(属性配置区域)以及上(辅助功能导航条)和下(版本信息和辅组展示信息)相应功能区域；
14.步骤三：从左侧组件菜单区域选择目标组件拖动到中间可视化配置区域进行位置、大小等配置，同时可以右键进行层级、组件关联等配置，也可以在右侧属性配置区域配置接口甚至在线添加功能代码；
15.步骤四：完成相关配置后可选择保存或者发布相应功能页面微应用。
16.根据本发明，提供了一种计算机设备，包括处理器、存储器以及存储在存储器中且被配置为由处理器执行的计算机程序，其特征在于，所述处理器执行所述程序时实现上述操作或方法。
17.根据本发明，提供了一种计算机可读存储介质，所述计算机可读存储介质存储有计算机程序，其特征在于，所述计算机程序被处理器执行时执行上述操作或方法。
18.与现有技术相比，本基于可视化拖拽编排的前端低代码系统具有以下优点：
19.1、速度快：本发明能帮助开发人员以及经过培训的非开发人员快速搭建所需应用，只需点击几下，用户就可以创建带有表单的页面。将一些表单和视图串在一起，你就得到了一个应用程序。点击、编译和测试循环的速度通常足够快，以使一些敏捷用户可以在讨论应用程序的会议期间实时开发应用程序。如果用户的需求达到了交付的最佳效果，那么与一组真正的开发人员进行开发应用所花费的时间相比，本发明可以花更少的时间来完成工作。
20.2、稳定性好：应用程序的维护企业来说是一件头疼的事情。只要软件服务于公司，创建应用程序只是支持过程的开始。通常定期维护更新比建立原始版本需要做更多的工作。本发明将这种支持成本分摊到整个软件周期中。当出现新的技术更新的时候，采用本发明意味着我们已经加入这整个生态之中，生态中每个人的利益是一致的，这比我们自己花费时间去做员工管理更加稳定快捷。
21.3、业务赋能：本发明不仅能帮助it部门，还能释放业务部门员工的创造力，这些开发人员有足够的想象力，但没有足够的预算来支持一个真正的开发团队。现在他们可以花几个小时点击来尝试一个想法，而不是起草没完没了的规范文档和预算请求。
22.4、强一致性：使用本发明来生产应用程序的最大好处是，你的代码将相对标准，甚至无需尝试，因为你的代码将使用与他人相同的工具。
23.5、安全性好：本发明通常被设计来处理最常见的挑战，比如安全或数据隐私。如果行业内存在技术漏洞问题，很有可能系统开发人员已经解决了这个问题，这就是使用共享框架的最大优势，他们已经处理了所有平台将会面临的风险。
24.6、简单易用：本发明采用拖拉拽方式配置应用程序，设计初衷就是为了使开发更简单。
附图说明
25.图1是本发明的整体设计架构图。
26.图2是本发明中计算机设备的结构示意图。
具体实施方式
27.以下是本发明的具体实施例并结合附图，对本发明的技术方案作进一步的描述，但本发明并不限于这些实施例。
28.如图1-图2所示，本实施例提供一种基于可视化拖拽编排的前端低代码系统，包括前端架构层和后端架构层：
29.前端架构层从下至上依次包括network、工具类、页面容器、打包编译、功能模块、浏览器、应用场景；
30.后端架构层从下至上依次包括基础设施、数据库、数据层、功能模块、api。
31.整体架构中：
32.数据存储采用关系型数据库mysql存储并采用缓存服务redis；
33.接口层面采用restful规范作为前后端接口约定；
34.前端技术采用当前流行框架vue，ui组件库element，webpack编译工具等；
35.前端工具类涉及可视化、动画、验证、导出、socket通信等
36.安全业务模块涉及场景、包、溯源分析、威胁情报、单点登录、推送、鉴权等；
37.适用场景为中后台分析系统和大屏可视化业务。
38.该系统的使用方法包括如下步骤：
39.步骤一：登录前端低代码系统，系统会根据账号分配对应权限；
40.步骤二：进入可视化配置功能页面，配置页面主要包含左(组件菜单)、中(可视化配置区域)、右(属性配置区域)以及上(辅助功能导航条)和下(版本信息和辅组展示信息)相应功能区域；
41.步骤三：从左侧组件菜单区域选择目标组件拖动到中间可视化配置区域进行位置、大小等配置，同时可以右键进行层级、组件关联等配置，也可以在右侧属性配置区域配置接口甚至在线添加功能代码；
42.步骤四：完成相关配置后可选择保存或者发布相应功能页面微应用。
43.本发明是一款图形化、通过拖拉拽方式配置以快速实现企业数字化转型中的创新应用、并支持用少量代码扩展以实现个性化需求的数字技术工具平台系统。
44.本发明用于填补当前市面上低代码组件不具备系统能力的不足点，同时让系统具备网络安全相关业务的能力。
45.本文中所描述的具体实施例仅仅是对本发明精神作举例说明。本发明所属技术领域的技术人员可以对所描述的具体实施例做各种各样的修改或补充或采用类似的方式替代，但并不会偏离本发明的精神或者超越所附权利要求书所定义的范围。

技术特征：
1.一种基于可视化拖拽编排的前端低代码系统，包括前端架构层和后端架构层，其特征在于：所述前端架构层从下至上依次包括network、工具类、页面容器、打包编译、功能模块、浏览器、应用场景；所述后端架构层从下至上依次包括基础设施、数据库、数据层、功能模块、api。2.一种基于可视化拖拽编排的前端低代码系统的使用方法，其特征在于，该使用方法包括如下步骤：步骤一：登录前端低代码系统，系统会根据账号分配对应权限；步骤二：进入可视化配置功能页面，配置页面主要包含左(组件菜单)、中(可视化配置区域)、右(属性配置区域)以及上(辅助功能导航条)和下(版本信息和辅组展示信息)相应功能区域；步骤三：从左侧组件菜单区域选择目标组件拖动到中间可视化配置区域进行位置、大小等配置，同时可以右键进行层级、组件关联等配置，也可以在右侧属性配置区域配置接口甚至在线添加功能代码；步骤四：完成相关配置后可选择保存或者发布相应功能页面微应用。3.一种计算机设备，包括处理器、存储器以及存储在存储器中且被配置为由处理器执行的计算机程序，其特征在于，所述处理器执行所述程序时实现如权利要求1或2所述的基于可视化拖拽编排的前端低代码系统操作或基于可视化拖拽编排的前端低代码系统的使用方法。4.一种计算机可读存储介质，所述计算机可读存储介质存储有计算机程序，其特征在于，所述计算机程序被处理器执行时执行如权利要求1或2所述的基于可视化拖拽编排的前端低代码系统操作或基于可视化拖拽编排的前端低代码系统的使用方法。

技术总结
本发明提供了一种基于可视化拖拽编排的前端低代码系统，属于程序开发技术领域，它解决了现有低代码系统不具备系统能力且缺乏网络安全相关业务能力，导致使用者无法在短时间内搭建所需应用等技术问题。本基于可视化拖拽编排的前端低代码系统，包括前端架构层和后端架构层：前端架构层从下至上依次包括network、工具类、页面容器、打包编译、功能模块、浏览器、应用场景；后端架构层从下至上依次包括基础设施、数据库、数据层、功能模块、API。本发明具有系统化构建安全应用的能力。系统化构建安全应用的能力。系统化构建安全应用的能力。


技术研发人员：刘庆林 柳博文 李小琼 魏海宇 刘正伟 谢辉 杨晓峰 刘海洋 姜小光 安恩庆
受保护的技术使用者：北京中睿天下信息技术有限公司
技术研发日：2023.07.07
技术公布日：2023/10/15