首页
学习
活动
专区
圈层
工具
发布
    • 综合排序
    • 最热优先
    • 最新优先
    时间不限
  • AI + 代码设计接入指南

    本文介绍VTJ的AI + 代码设计器使用方式以及如何实现服务定制。VTJ 是一款以AI驱动的Vue3前端代码开发工具。 内置代码引擎、渲染代码生成器,支持Vue源码与代码DSL双向转换,面向前端开发者,开箱即用。 无缝嵌入本地开发工程,不改变前端开发流程和编码习惯。 本地开发本地开发的流程跟原本开发流程是一致的, 设计只是一个辅助工具,嵌入到本地开发环境,让开发者可以使用代码的方式去开发应用,设计不是应用的一部分。项目编译打包后是不带有设计的。 把这类的实例以service参数传递给代码引擎即可。 ,因此在设计是不包含页面预览的功能,需要预览功能可以用@vtj/renderer实现后与设计对接,本文仅介绍设计,渲染部分后续另外补充。

    39310编辑于 2025-05-29
  • 来自专栏OneCode 低代码

    代码平台代码导出设计

    代码平台相对成熟的今天,这一功能也成为了绝大多数商业企业级低代码平台的必备功能,本文将从模块代码导出的角度来聊一下,代码平台的代码出码设计。 二,OneCode代码引擎出码设计 OneCode代码引擎是一款基于DDD驱动设计的通用代码引擎。 (3)通用领域模型元数据设计 ? ​ (4)页面设计 ?这种方式优点是: 简单易操作,一个稍有经验的高级程序员即可完成整套的基础模板设计,在经过模板输出后可以大幅降低普通程序员的劳动强度。 二,OneCode代码引擎出码设计 OneCode代码引擎是一款基于DDD驱动设计的通用代码引擎。 (3)通用领域模型元数据设计 ? ​ (4)页面设计 ?

    2K40编辑于 2023-07-19
  • 来自专栏AI + 低代码 技术解密

    AI + 代码 技术解密(七):设计和渲染

    本文档介绍了支持 VTJ 代码体验的可视化设计环境 (@vtj/designer) 和运行时渲染系统 (@vtj/renderer)。 Core Designer 类​Designer 类充当所有设计时交互的中心编排,管理鼠标事件、拖放作、元素选择和视觉反馈系统。 事件处理系统​Designer 实现了一个全面的事件处理系统,该系统可以捕获用户交互并将其转换为设计作:视觉反馈组件​Designer 系统通过突出显示交互式元素的叠加组件提供实时视觉反馈:渲染架构​ 模拟架构​元件检测​在设计模式下,Renderer 使用特殊属性检测 DOM 元素,使 Designer 能够跟踪和作它们:视口和响应式设计​Designer 提供了一个复杂的视口系统,该系统支持多种设备模式和自定义大小调整 ,以便进行响应式设计测试。

    18500编辑于 2025-06-23
  • 来自专栏前端技术江湖

    代码设计的自由布局拖动的实现原理

    前言 大家好,我们在这篇文章中来分享一下自由布局拖动的实现原理,实现一个设计组件自由拖动的最简demo。 属性值如下所示: true:规定元素的可拖动的 false:规定元素不可拖动 auto:使用浏览的默认行为 当我们在元素元素标签中添加 draggable 属性时,该元素就可以进行拖动操作了。 none:不能把元素拖放至此 move:移动到目标 copy:复制到目标 link:目标打开拖动元素(拖动元素必须是链接并有URL) 页面设计的实现 下面我们根据以上的知识点来实现一下页面设计组件拖动的最简 下面是代码的实现。 后记 这篇文章中我们实现了页面设计组件自由布局的最简demo,让大家理解自由拖动的实现原理。至于里面还有一些细节的处理,大家可以根据自己的需要自行实现~对该系列文章感兴趣的小伙伴来一波关注吧。

    5.2K30编辑于 2021-12-06
  • 来自专栏phodal

    UI 设计代码化:代码设计语言 —— Unflow

    UI 设计代码化,即将软件的 UI 设计与 UI 交互转换为特定的领域语言,并使用代码的方式来进行管理。 在 Uncode IDE 里,设计代码化是由两部分组成:架构设计代码设计代码化与 UI 设计代码化,这是一个相当复杂的领域。 UI 设计代码化 UI 设计代码化,即将软件的 UI 设计与 UI 交互转换为特定的领域语言,并使用代码的方式来进行管理。 它可以直接将需求转换为 UI 原型,让设计人员基于此进行设计;还负责将其转换对应的 UI 代码,方便开发人员进行编写。 为什么需要 UI 设计代码化? 在文章开头里,我们定义了一下:UI 设计代码化。 即我们的设计与 UI 原型、代码是相绑定的,当代码设计不一致时,我们能即时得到反馈 —— 要么修改设计,要么修改代码。 连接需求与代码的胶水。

    1.2K30发布于 2021-06-09
  • 来自专栏腾讯云设计中心

    代码开发平台设计初探索

    代码开发平台是一种通过拼装可重复使用的组件,实现不写代码或只编写少量代码即可快速搭建软件应用的开发平台,开发人员可以通过可视化的工作界面快速设计应用。在这样的背景下,设计师应该如何为码平台赋能? 代码开发模式与体验维度 企业用户期望借助码平台达成的目标 降低开发门槛: 代码开发平台基于业务形式进行码封装,并提供了可视化、可拖拽的便捷式操作,减少了大量单纯的代码编程操作,降低了开发门槛。 Part1 降低开发门槛 一个代码开发平台应基于可视化工作流,通过可视化的编辑界面进行开发工作,开发者可通过组件拖拽调用,参数配置、逻辑规则定义等方式,结合常规代码编写,完成软件应用的搭建。 代码编辑: 通常由组件模块,组件调用及组装区,页面搭建区,参数配置模块,组件树等模块组成。 outsystem编辑界面 WeApps是一款纯自研的一站式应用研发平台,私有化版本目前已投入使用。 组件树与编辑视图的联动 Part2 加快应用交付 流程设计、业务逻辑设计等是代码平台的核心能力,可视化设计能力帮助终端用户简化开发。

    3.1K12编辑于 2022-05-05
  • 来自专栏深度学习与python

    基于 Vue 和 Canvas,轻舟代码 Web 端可视化编辑设计解析 | 代码技术内幕

    我们开设《代码技术内幕》专栏,旨在讨论代码编程领域中的困难、问题,以及高效的解决方案。本文为第二篇,结合我们的产品研发经验解读打造 web 端可视化代码编辑需要权衡的因素以及技术实现的要点。 专栏内容回顾:代码编程及其市场机遇剖析 | 代码技术内幕   轻舟代码平台是一款基于云服务的 web 端产品,面向零基础或者有一定编程基础的用户。 用户不需要额外安装软件,就可以在任何有浏览的电脑上编写和发布应用。可视化代码编辑 是轻舟代码平台的重要组成部分,用户通过可视化界面开发应用。 高性能渲染 代码可视化编辑保留了控制流的设计,所以在整体结构上类似于传统的 流程图。 但其与流程图有两个明显的区别: 流程图的节点相对简单且布局自由,而轻舟代码的可视化代码编辑的 节点多且复杂(超一个量级)且布局严格。

    2.6K20编辑于 2023-04-10
  • 来自专栏LCHub低代码社区

    代码宣言——代码指南

    代码指南》序言 虽然维格云公司一直都被认为是一个代码软件公司。 产品维格云,拥有着像电子表格一样,但是可以轻松的定制出各种各样的应用系统,想客户管理系统、项目管理系统等等数千种应用场景。 但是,老实说,在2021年以前,我从来没有听过低代码这个词。 在我看来,代码更多是一种事后总结。 要让我讲解代码,我觉得还不如从我的创业初心开始说起。 虽然说是“代码”,但是,操作代码软件的人,却是个具有高水平技术素养的人,像技术工程师,架构师等,他们需要拖拽复杂的业务逻辑和节点。 中学级。 维格云,就是定位于一个“小学级”的代码产品,希望能够真正的普惠社会。 不同的代码产品都会互相依存,并不是你死我活的,他们存在于不同的场景、不同的行业、不同的用户群,现在还只是一个开始,我们需要耐心,越多的代码产品进入市场,越能加速这个社会数字化平权的过程,让越多的普通人获得科技能力

    1.6K31编辑于 2022-06-01
  • 来自专栏腾讯大讲堂的专栏

    云开发代码开发平台设计初探

    代码被推到了风口上。有幸担任云开发码 LowCode 项目团队的交互设计师,借此机会将我对码的理解和“如何降低码门槛?如何封装技术概念为用户提供简单易懂的操作流程?”的设计过程分享给大家。 3.2 设计目标 ? 上文提到,码平台的目标用户是非技术人员,一个好的aPaaS 平台是可以让非技术背景的用户在极短的时间内通过少量代码就可完成应用的设计、开发、测试、分发。 降低门槛的设计 结合码的实际情况,通过以下两个方法详细讲解码在设计过程中的如何降低产品的使用门槛。 ? 封装技术概念 上文提到,码的高门槛体现在技术概念的理解上。 在设计优化之后,用户可以比较轻松地使用数据源,但是本次回访得到最一致的一个回答就是:应用构建成功之后进入编辑,然后不知道下一步该做什么了。 ? 每当代码开发平台开发一个新功能模块时,都要提前设计好框架和逻辑,以应对高可配置需要的各种可能性。这也是代码开发平台作为一个大而全的 PaaS 引擎所必须面对的挑战。

    2.6K30发布于 2021-04-06
  • 来自专栏腾讯云设计中心

    云开发代码开发平台设计初探

    代码被推到了风口上。有幸担任云开发码 LowCode 项目团队的交互设计师,借此机会将我对码的理解和“如何降低码门槛?如何封装技术概念为用户提供简单易懂的操作流程?”的设计过程分享给大家。 3.2 设计目标 上文提到,码平台的目标用户是非技术人员,一个好的aPaaS 平台是可以让非技术背景的用户在极短的时间内通过少量代码就可完成应用的设计、开发、测试、分发。 降低门槛的设计 结合码的实际情况,通过以下两个方法详细讲解码在设计过程中的如何降低产品的使用门槛。 封装技术概念 上文提到,码的高门槛体现在技术概念的理解上。 在设计优化之后,用户可以比较轻松地使用数据源,但是本次回访得到最一致的一个回答就是:应用构建成功之后进入编辑,然后不知道下一步该做什么了。 每当代码开发平台开发一个新功能模块时,都要提前设计好框架和逻辑,以应对高可配置需要的各种可能性。这也是代码开发平台作为一个大而全的 PaaS 引擎所必须面对的挑战。

    2.6K31编辑于 2022-05-05
  • 来自专栏LCHub低代码社区

    《实战AI代码》什么是AI代码? 《实战AI代码》什么是AI代码

    人工智能代码平台 人工智能代码平台(Artificial Intelligence Low-Code Platform,简称AI Low-Code Platform)是一种基于人工智能技术的软件开发平台 该平台通过提供可视化的开发工具和预先构建的模块,使开发者能够在不需要编写大量代码的情况下,快速构建出高质量的人工智能应用程序。 图片 特点 1. 自动化部署:AI Low-Code Platform提供了自动化部署功能,使开发者能够快速将应用程序部署到云端或本地服务上。 4.

    1.4K30编辑于 2023-06-16
  • 来自专栏云开发

    直播预约:代码架构设计与思考

    1 月 17 日(本周二)19:30—20:30,腾讯云微搭「实战代码」系列直播专栏,第八期:代码架构设计与思考 本期直播活动,由腾讯云高级前端工程师作为导师,带大家了解微搭代码架构设计与思考。 ,主要负责微搭编辑、BFF核心功能开发,专注于代码研发能力,工程化建设。 在性能优化、工程化、编辑、NodeJS等方向有丰富的落地经验。 直播收获: 1、和专家面对面沟通,交流代码技术; 2、专家带你快速搭建新应用; 3、更有腾讯周边礼品等你拿~ ---- 关于腾讯云微搭代码 微搭是什么? 灵活的扩展性 除了代码能力以外,更可支持全代码混合开发、云函数、自定义组件等能力以应对复杂业务逻辑的应用场景开发。

    93230编辑于 2023-01-18
  • 来自专栏aPaaS和低代码

    代码如何设计高效的数据模型?

    然而,代码平台的性能和扩展性不仅依赖于开发工具的易用性,更取决于其底层数据模型的设计。数据模型是代码平台的核心组件,它定义了数据的结构、关系和约束,直接影响平台的易用性、性能和扩展性。 合理设计的数据模型能够高效组织数据,保障数据一致性,并为快速开发提供支持。本文将深入探讨代码平台中常见的数据模型设计方案,分析其技术特点、适用场景及优劣势,为选择合适的数据模型提供参考。 代码内的数据主要划分为两类一类是以声明式配置存储为核心的各类配置数据存储。一类是以业务数据存储为核心的各类业务数据的存储【本文核心讨论此类数据的存储模型设计】。 业务数据存储的几种方式一般来说代码平台的业务数据存储设计包含以下几种方式:基于数据库表存储基于文档数据库存储基于大宽表+扩展字段存储01基于数据库方式基于数据库的方式存储是日常开发中最常见的方式,通过设计数据模型 03基于大宽表 + 扩展字段设计模式这种方案其实最开始来源于ERP产品的设计,在早期为了方便扩展会增加各个类型的扩展字段15-20个。在代码的初期也有一些按照此方式实现的案例。

    49210编辑于 2025-03-24
  • 来自专栏技术人说

    代码时代的开发加速

    “写代码”这件事变得不再是前端工程师的专属任务。尤其是在代码平台的推动下,越来越多非技术背景的业务人员也能直接参与产品界面搭建。而其中最具代表性的生产力工具,非拖拽式 UI 生成器莫属。 配置 ≠ 编码,属性编辑取代代码输入每个拖入的组件,都自带属性面板,你可以像填表单一样修改它的标题、宽度、绑定字段、触发事件等,甚至还能连后端 API。 可以考虑:使用懒加载和代码分割优化组件复用方式手动调整某些配置项 底层技术原理,简单了解一下一个完整的拖拽式 UI 生成器,底层通常包括这些模块:模块作用拖拽引擎控制组件的拖动、定位、嵌套关系等渲染把 拖拽式 UI 生成器,是代码平台中最实用、最直观、也最具影响力的一环。它让 UI 构建不再依赖重度编码,也让产品和业务能更主动参与进来。某种程度上,它已经成了“人人都是开发者”的重要抓手。 真正高效的代码开发,始终离不开对技术和业务的深入理解。愿每个认真搭积木的你,都能用拖拽拼出一款靠谱的产品界面。

    31510编辑于 2025-06-27
  • 来自专栏前端森林

    代码平台的属性面板该如何设计

    在之前的如何设计实现 H5 营销页面搭建系统中,我对前端目前的代码平台的设计中的一些问题做了一些阐述,但并没有深入到很细节的地方去展开探讨。接下来,我会对其中的一些实现细节通过几篇文章来依次分享。 我们先对整个平台的设计做一下简单回顾: 这里是我平时自己维护的一个代码平台,技术栈是Vue。后续的分享也是基于该平台的一些具体实现细节展开 和市面上大部分可视化搭建系统基本类似。 这个也是本篇文章的主题:代码平台的属性面板该如何设计? 1属性面板应该包含哪些内容? 2属性和组件的映射关系 其实上面的四块内容,内容渲染应该是最复杂的。采用合适的渲染来渲染对应的属性才是最重要的。 但存在一些场景,一些属性可以被多种渲染来渲染,像字体大小-fontSize,既可以用input-number,又可以用slider。那么这种场景应该如何选用最合适的渲染呢?

    1.7K50编辑于 2022-04-28
  • 来自专栏LCHub低代码社区

    代码指南》:26“代码”为何而生?

    代码”为何而生?代码开发平台至今已发展得较为成熟,现在我们站在较高的“上帝视角”,回顾“代码”诞生的合理性。 其实,代码平台除了击破重复编程的高成本痛点之外,还解决了两大难点:沟通隔阂和效率问题。 1、需求方与技术方之间的认知和沟通隔阂图片传统的软件定制开发环节中,需求方往往会提一大堆业务流程、数据收录、界面设计等要求。经验丰富的技术员能理解甲方的业务流程,用正确的逻辑完成开发。 图片代码开发平台凭着自身可视化、易理解的配置功能,让业务人员更清楚如何用上面的功能来开发应用;开发人员也能借助平台的界面、功能使用指南,更轻松地让业务人员理解应用实施逻辑。 现在市面上绝大多数的代码平台也在主张由业务人员自行实施应用,背后也是这个道理。

    38710编辑于 2023-06-14
  • 来自专栏LCHub低代码社区

    代码指南》:2什么是代码

    对于程序员而言,代码开发平台的性质与IDEA、VS等代码IDE(集成开发环境)几乎一样,都是服务于开发者的生产力工具。 与传统代码IDE不同的是,代码开发平台提供的是更高维和易用的可视化IDE。 这个定义更偏向于阐明代码所带来的核心价值: 代码开发平台能够实现业务应用的快速交付。 而且我们有理由相信,随着代码技术、产品和行业的不断成熟,这个提升倍数还能继续上涨。 代码开发平台能够降低业务应用的开发成本。 一方面,代码开发在软件全生命周期流程上的投入都要更低(代码编写更少、环境设置和部署成本也更简单);另一方面,代码开发还显著降低了开发人员的使用门槛,非专业开发者经过简单的IT基础培训就能快速上岗,既能充分调动和利用企业现有的各方面人力资源 ——LCHub代码社区

    78540编辑于 2023-03-02
  • 来自专栏微搭低代码

    微搭代码入门教程-码编辑介绍

    目录 01 总体介绍 02 应用介绍 03 页面介绍 04 hello,world 05 变量定义 06 数据绑定 我们在第四节的教程中介绍了平台方法的具体使用,本节我们介绍一下码方法的调用。 作为码平台除了拖拉拽之外,最强大的功能就是可以写代码了,可以调用平台提供的丰富的API,给我们小程序添加特色的功能。 码编辑现在是在导航条上打开,先点击工具菜单的图标 [在这里插入图片描述] 在弹出的界面选择代码编辑 [在这里插入图片描述] [在这里插入图片描述] 码方法的作用域分为全局和页面,全局定义的方法 [在这里插入图片描述] 保存后会生成一个代码的模板,我们方法的作用是弹出一个对话框,显示你好,世界的内容 为此我们,需要找一下官方的api看看对话框是如何创建的 官方API [在这里插入图片描述] 复制代码进入到码编辑 [在这里插入图片描述] 当然了这个是基础教程,具体你的码里要怎么处理需要根据需求而定,基本上核心的内容都是需要在码里完成的。

    1.4K10编辑于 2021-12-20
  • 来自专栏LCHub低代码社区

    代码指南》:22代码产品形态?

    代码产品形态?搞清楚整个代码的发展现状以后,那么,整个代码领域主要的产品形态有哪些呢?了解其主要的产品形态,对于我们形成代码的直观印象非常有帮助。 在我看来,主要分为四类:表单生成类:以 宜搭云 和 JNPF 为代表,主张通过可视化的设计来完成页面布局、编排、设计,即所谓的“所见即所得”,类似的还有 iVX。 图片服务聚合类:以 APICloud 为代表,基于API聚合的组件市场工具,通过流程管理工具,可以管理整个应用的开发周期,从产品、设计开始,到研发测试和运营。 图片所以,整体而言,代码产品的核心是表单引擎 和 流程引擎(BPM),外围支撑是BI引擎、*协同工作、服务聚合等等,目前,市面上主流的代码产品,表单引擎和流程引擎(BPM)基本是标配,所以,严格地说起来 下面是部分代码产品的截图:

    61730编辑于 2023-06-13
  • 来自专栏深度学习与python

    面向数字化提质提效的代码架构设计 | 代码技术内幕

    我们开设《代码技术内幕》专栏,旨在讨论代码编程领域中的困难、问题,以及高效的解决方案。本文为第三篇,与读者共同探讨数字化转型背景下的代码平台架构设计。 专栏内容回顾: 基于 Vue 和 Canvas,轻舟代码 Web 端可视化编辑设计解析 | 代码技术内幕 代码编程及其市场机遇剖析 | 代码技术内幕 在代码市场篇中我们概述了代码的定义和代码产品的主要定位 我们的平台架构整体上可以划分成平台服务,集成开发环境,NASL 语言及其配套设施,资产中心,云原生基座五大模块,设计如下: 轻舟代码平台产品架构设计 平台服务 代码平台服务的设计目标是“提供一站式应用开发平台 它包括以下组件: 可视化设计:可视化设计提供了 NASL 语言的可视化投影,使得代码开发者可以通过可视化拖拉拽的形式来编写 NASL 语言。包含页面设计、数据设计、逻辑设计、流程设计等。 同时可视化设计提供了撤销重做、复制粘贴等便捷操作能力。

    67530编辑于 2023-05-09
领券