React

自研项目：橙武低代码平台设计与搭建 主导设计并搭建企业级低代码平台——橙武低代码平台，基于 Amis、LogicFlow、Pebble 与 MySQL 8 构建，具备 SaaS 多租户支持、可视化流程编排、动态表单生成与模板引擎渲染等核心能力，广泛适用于制造业、零售、政企、CRM 等多种业务场景。 项目实践中，成功应用该平台完成美发行业管理软件的开发与优化，形成面向垂直行业的低代码最佳实践。平台显著提升了开发效率，加速产品交付周期，有力推动了业务数字化与行业创新进程。 平台后台体验地址：https://admin.cwcode.top

简单来说，它是一个旨在极大简化表单创建过程的软件开发工具。它利用图形化界面（通常是拖拽式操作）和预先构建好的组件，让用户（尤其是非专业开发者）能够快速、直观地设计和构建功能丰富的在线表单，而无需或只需编写极少量的传统代码。 技术选型： 核心库：react.js(18.3.1) react-dom(18.3.1) typescript(5.8.3) 路由：react-router-dom 状态库: zustand css框架：tailwindcss(3.4.17) 国际化：react-il8next UI组件库: antd 打包工具: vite 语法检查: eslint 核心特点: 可视化设计界面 : 1. 所见即所得： 用户在一个类似画布的界面上直接操作表单元素（如文本框、下拉框、单选框、复选框、日期选择器、子表单等）。 2. 拖拽操作： 通过鼠标将所需组件从组件库拖放到设计区域。 3. 实时预览： 设计过程中可以实时看到表单的最终呈现效果，无需编译或部署。 低代码/无代码: 配置取代编码： 表单的逻辑（如字段校验规则、条件显示/隐藏、数据联动、简单的计算）通常通过配置属性面板（如设置必填、格式、显示条件等）来实现，而不是编写复杂的JavaScript或后端代码。 丰富的组件库: 1. 提供大量预构建、可复用的表单字段组件（如输入框、选择器、日期时间、成员单选、子表单、多标签、过滤条件等） 2. 组件通常具有丰富的属性可配置（样式、校验、交互行为）。

1.技术栈：Go、gorm、MySQL、React、Taro 2.负责营销低代码平台后端架构设计与业务接口开发 3.负责营销低代码平台前端架构设计与核心模块开发 4.负责营销低代码平台组件库设计与开发 5.负责营销低代码平台性能监控与优化

1、【产品定位】聚源云平台专业为工业物联网用户量身定制的信息化系统，提供安全可靠的设备接入和通讯能力，可低成本快速实现产品场景智能化，通过应用开发、组态服务、运维管理、数据中心等核心功能，对工业现场信息实现有效分析和处理，为用户提供全通讯方式的硬件+软件解决方案。 2、【方案特色】以胶水代码组件和物模型方案，极大的提高了平台对工业物联行业眼花缭乱的设备和协议的兼容能力；同时提供低代码、可视化的大屏、组态构建能力；方便集成商快速为客户以极低的成本完成客制化定制；同时提供SAAS和私有化方案。 3、【产品简介】该平台主要包含产品管理，设备管理，视频中心，大屏管理，组态管理，报警联动，数据中心以及系统管理等模块，其中设备管理、报警联动、大屏管理形成基本的业务管理逻辑；系统模块支持集成商完成组织层级管理和oem个性化定制。

1. 主要模块： 编辑器、图层布局器、组件库、模板库、素材库、内置控件库、代码生成器 2. 功能效果： 2.1. 以项目为配置单元，每个项目可以创建单个或多个页面； 2.2. 用户可通过在编辑器内拖拉拽的方式，将组件库内的组件放置到画布内进行调整配置，最终保存为数据可视化的大屏或移动端项目，该项目支持下载源码进行离线部署，也支持直接发布成外链进行访问； 2.3. 支持通过JS代码进行事件派发订阅、自定义组件等高级操作； 2.4. 支持用户自行维护组件库，按平台规范开发自定义组件、上传、使用； 2.5. 支持用户自行维护模板库，通过保存项目为模板以便快速搭投同类型项目； 2.6. 支持将页面导出为配置文件，通过配置文件新建页面； 2.7. 对于多页面项目，可以很方便地配置路由跳转； 2.8. 支持平台内部数据或API数据接入 2.9. 其他功能未一一列举 3. 职责： 本人负责整个低代码平台的架构搭建与核心代码开发，包括但不限于规范制定、技术更新、迁移评估、脚手架开发、组件库开发、性能优化、专利转化： 3.1. 本项目从零开始，对竞品进行了相关调研，与领导、PM进行多次讨论，确定产品方向 3.2. 底层基础设计：图层协议及画布协议的设计、图层类/图层编组类的设计、配置栏控件协议、组件库组件的开发管理规范设计等； 3.3. 平台技术对接规范、开发规范等的编写； 3.4. 到本人离职前，该平台已实现“配置可视化+组件生态化+素材自由化”，已可覆盖交互不那么复杂的可视化大屏页面和移动端页面，能减轻50～60%的前端工作量。目前已推广应用到一部分项目线上，反馈良好 4. 技术栈： 该平台主要技术栈为Typescript + React + Nodejs 5. 难点： 5.1. 各类协议制定； 5.2. 图层操作（增、删、改、编组、取消编组、尺寸调整等）优化；

低代码平台，可以快速搭建京东中台各页面，包含多种组件，依托于京东组件库，可以拖拽出各种样式的页面，并且可以联通数据和其他项目要求，极大减少了开发时间，做到了提效并且向外赋能的能力。 我在项目中主要参与组件接入低代码平台以及对于各组件在低代码平台的适配

H5装修平台是一种用于创建和定制H5页面的工具或平台，它使用户能够以可视化的方式设计、编辑和发布专业水平的H5网页，而无需编写代码。提供了丰富的模板、组件库、动画效果、字体库等资源，以帮助toB用户快速构建各种类型的H5页面，如营销页面、产品展示页面、活动页面等。 功能介绍： 1.可视化编辑器： 提供直观的拖放界面和所见即所得的编辑功能，用户可以通过简单的操作来添加、编辑和排列页面元素。 2.模板库： 包含各种预设计的H5页面模板，用户可以根据自己的需求选择并快速开始定制。 3.组件库： 提供丰富多样的组件，如图片轮播、视频播放器、文本框、按钮等，用户可以根据需要自由组合和定制。 4.动画效果： 支持添加各种动画效果，如淡入淡出、滑动、缩放等，以增强页面的视觉吸引力和交互性。 5.响应式设计： 支持响应式布局，使用户可以轻松创建适应不同设备尺寸的页面，包括桌面、平板和手机等。 6.即时预览： 提供实时预览功能，让用户可以随时查看编辑后的页面效果，并及时调整。 7.多媒体支持： 允许用户添加图片、视频、音频等多媒体内容，以丰富页面的呈现形式。 8.云端存储和发布： 用户可以将他们的H5页面保存到云端，并轻松地分享或嵌入到网站、社交媒体或其他平台中。 9.数据统计和分析： 提供页面访问量、转化率等数据统计和分析功能，帮助用户了解页面表现并优化设计。 10.多人协作： 支持多人同时编辑和协作，团队成员可以共同参与页面的设计和修改。

1. 项目分为渲染引擎，流程引擎，构造器，模型层，权限层等部分。 2. 我负责渲染引擎，流程引擎的开发，担任前端负责人

可视化搭建平台可以以拖拽化的方式搭建各类数据展板，控件，布局等等。绑定数据模型，配置组件交互等等功能。

地址：https://youdata.163.com/index/data-screen 项目概要：数据大屏 Pro 是一款先进的低代码编辑器，专注于提供数据大屏的展示功能。该平台以其成熟的特性和直观的用户界面，让用户能够通过拖拉拽的方式轻松完成数据大屏的创建。 功能特性：数据大屏 Pro 平台具备多个核心功能，包括组件加载、组件渲染周期、数据接入周期、事件周期、配置项注入、导入导出以及自定义组件等。这些功能共同构成了一个完整的数据可视化解决方案，使用户能够根据自己的需求进行定制和扩展。 用户体验：为了提高用户的使用体验，数据大屏 Pro 平台还提供了多种易用性操作功能，如多选、对齐、组合、动态图层、复制粘贴、快捷键以及锁定隐藏等。这些功能使得用户在操作数据大屏时更加得心应手，提高了工作效率。

项目简介：公司中台研发部开发的aPaaS低代码平台，快速生成pc端与移动端页面。页面产出需要经历模型层，交互层、事件层三个部分，其中交互层设计器是基于vision框架实现，它是一套类似Webpack Tapable事件流机制实现的框架，通过该框架只需要在React组件上简单打标与配置，就可以实现节点树管理、节点树json转化、节点渲染、交互处理（拖拽，缩放，滚动、功能按钮组等）、动态属性菜单等功能。 工作内容：该框架由我主导开发与维护，并录制多个框架源码课程，在公司内分享讲解，协调移动组与PC组技术进行协作开发。 项目成果：为飞搭交互层设计器提供了低耦合、易于拓展的基础框架，显著降低了低代码组件的开发时间与难度。

1. 项目概述：该企业级应用旨在帮助公司管理各种流程的生命周期，以及流程中台的运营。通过极低的代码成本，可以快速适应公 司不同的流程需求，并生成相应的表单系统。 2. 系统规模：包括三大核心模块，使用了10多个自定义组件，覆盖了50多个页面，同时支持PC端和移动端H5的访问。 3. 技术架构：基于Vue2进行开发，使用了vue-router进行页面路由管理，vuex进行状态管理，v-cli作为脚手架工具，并结合 Element-UI组件库进行界面设计。 4. 个人职责： a. 公共部分：负责开发和封装了Ajax拦截器，以及一系列功能性函数（防抖、节流、字面量判断、常用正则等），为项目提供基础功能支持。 b. 组件部分：根据项目需求，开发了满足当前项目需求的组件，并将其整理成组件库，通过npm提供下载。 c. 文档部分：利用vitepress工具，编写了主要的组件使用文档和API接口文档，方便团队成员查阅和使用。 d. 整体优化：对构建速度和代码体积进行了优化，同时采用了面向对象编程的思想，提升了代码的可维护性和可扩展性。 业绩: 1. 细化 css 颗粒，使 class=w24 h24 md:w48 md:hauto ，更加语义，提升开发效率 2. git-hooks husky 配合 eslint,prettier 处理代码规范，使不合规代码无法提交，提升系统品质 3. 根据 webpack 配置 CssMinimizerPlugin 压缩，splitChunks 分包，以及 TerserPlugin 多进程打包，使 webpack 构建速度优化，产出物优化。 4. 建立组件文档，功能函数文档，使同事阅读文档开箱即用，减少重复开发 5.keep-alive 缓存技术，懒加载，移动端虚拟列表，小图片转 base64等常用的性能优化提升项目渲染

1.可视化表单设计：平台提供直观易用的可视化界面，通过拖拽和配置的方式，用户可以自定义表单的字段、布局和样式，包括文本框、下拉框、日期选择器、复选框等各种表单元素。 2.逻辑和条件设置：平台支持在表单中添加逻辑和条件，例如字段之间的关联、计算公式、字段显示与隐藏的条件等。这样可以根据不同的条件自动调整表单的展现和行为。 3.数据集成和连接：平台允许将表单与其他系统或数据源进行集成，例如数据库、外部API等。这样可以实现表单数据的自动填充、数据查询和数据提交到其他系统的功能。 4.审批流程配置：除了表单设计，平台还提供了配置审批流程的功能。用户可以定义不同的审批节点、审批人员和审批条件，以及设置流程的自动化触发和流转规则。 5.表单版本管理：平台支持表单版本的管理，可以对表单进行修改、保存和发布。同时，系统还可以跟踪表单的历史修改记录，方便用户进行版本回溯和恢复。 6.权限和安全性：平台提供细粒度的权限控制，可以根据用户角色和组织结构设置表单的查看、编辑和提交权限。此外，平台应该具备数据的加密和安全传输机制，确保敏感数据的保护。 7.报表和统计分析：平台能够生成各类报表和统计分析，帮助用户了解表单的使用情况、数据统计和趋势分析，以便进行业务决策和优化。

从0到1搭建整体网站 搭建面向任务领域的逻辑编排低代码平台，实现后端数据任务的可视化开发与托管 完成前端整体架构设计，可实现组件分组、分区、属性动态关联等功能 以schema的形式定义组件，可实现组件的配置化引入与修改 支持任务在线断点调试、任务复制、草稿管理等功能 支持任务的全生命周期管理

1.项目包括 GIS、 BI看板、自定义应用任务流、BIM 模型 等功能 2.主要负责自定义应用 任务流程 组件库 为业务组提高开发效率、同时降低技术门槛：低代码平台不需要开发人员具备深入的编程知识，即使是非专业的开发人员也可以使用它来创建应用程序。这降低了技术门槛，使更多的人能够参与到应用程序开发中来。提供灵活性和可扩展性：低代码平台通常提供了各种预定义的组件和模块，可以快速构建应用程序的基础功能。同时，它也支持自定义代码的集成，允许开发人员在需要的时候进行个性化的扩展和定制 也减少维护成本 3.难点： 1、导入excel表格 以及 word 中的表格 并且对表格中内容进行编辑 2、表格中可以增加Form表单控件 使得导入的表格 在设计后 可直接在网页中提供用户填写 进而进行审核

1. 该项目使用的是webpack + react + mbox + antd技术栈进行开发。 2. PC端支持拖拽表单元素来为流程节点来设计不同的表单填写信息。 3. 移动端、PC端均可以对工单进行审批、驳回、修改等操作。 4. 支持通过iframe嵌入itsm系统，对外部提供交互api。

开发为企业部署的智能对话机器人（常见官网右下角的帮助机器人）。包括后台管理全部功能：意图配置，学习训练，sdk配置等等；智能对话机器人sdk全部开发。

通过拖拉拽组件自动生成包含 react、js、css 等的项目代码，结合前端项目 cicd 可实现自动生成代码、一件部署项目等功能。内含拖拽平台和代码自动转换平台。

低代码平台分为低代码渲染引擎和低代码搭建平台。低代码渲染引擎是使用JSON配置来渲染页面，减少页面开发的工作量，极大的提高研发效率。低代码搭建平台则是通过组件拖拽来生成JSON配置，可以快速的搭建一个页面。 我参与低代码渲染引擎和低代码搭建平台的前端架构设计及功能开发，前端核心框架使用了React框架，技术栈包括：React、typescript、antd。

1. 基于React.js开发的医疗数字化营运聚合平台，面对B端用户，可用来进行医疗直播、线上诊疗、医学活动推广等功能 2. 参与开发了可视化页面配置功能，开发了包括分类导航、轮播图、内容列表等可配置的控件;开发了模版库、主题风格配置等功能 3. 项目上线后稳定运行，良好的功能体验，获得客户一致好评 4. 技术栈: React.js、React Router、MobX、Typescript