薛鸿杰

AI 全栈 / AI 前端开发

以工程化与可验证交付，落到可上线产品。

以工程化与可验证交付，把 AI 辅助研发和业务系统落到可上线产品。

工作经验
10 年前端开发经验
团队管理
6 年
所在地
深圳
电话
13554790078
出生年月
1994.02

个人优势

  1. 01

    10 年前端开发经验，含 6 年团队管理，主导 10+ 个大型企业级项目，覆盖 Web、H5、小程序、数据大屏及微前端中台系统

  2. 02

    从零搭建 Monorepo 工程体系、自动化发布流程与 @jyf/* 私有 npm 包体系（规范配置、类型、工具、CLI），统一规范接入公司 35+ 个前端工程，新项目初始化时间缩短 60%，团队开发效率提升 50% 以上

  3. 03

    主导 @jyf/el-component 后台组件库与 WebDevLib 工程化工具集，分别复用于 11 个后台系统与 16 个 uni-app 项目，标准 CRUD 页面开发压缩至 15 分钟，整体页面搭建效率提升 40%

  4. 04

    建立 Claude Code、Codex、ZCode 等 AI 编码工具的团队研发规范，并落地 Dify 工作流（知识库检索、代码执行、条件分支等节点），覆盖需求开发与数据处理全流程

  5. 05

    具备 Node.js / Python 全栈交付能力：独立完成接口开发、数据处理与 Docker Compose / Nginx 部署运维

项目经历

主推项目

HLI Frontier 集团官网与自动化部署

2026.06–2026.10

hlifrontier.com

  • 迭代集团官网 hlifrontier.com，建设四大业务板块、产品/解决方案页与服务端咨询表单，并完成独立构建部署
  • 将部署脚本沉淀为 hli-deploy 共享 CLI：多环境配置、SSH 上传、服务器端 Docker Compose 构建、健康检查、版本备份与失败自动回滚
  • 接入 GitHub Actions，按变更路径触发独立部署，保留人工回滚与部署历史
技术栈
  • Next.js
  • React
  • TypeScript
  • TailwindCSS
  • Vitest
  • Playwright
  • Docker Compose
  • GitHub Actions

AI 心理状态辅助测评系统

2026.07–2026.10

Vue3 + FastAPI；主导航空与社区双场景测评、异步分析链路与多端报告。

  • 主导航空与社区双场景测评流程，覆盖身份录入、知情同意、预训练、60 秒视频采集与报告查询
  • 设计异步分析链路：视频上传、任务创建、轮询、结果校验与持久化，接入合作方 V3.2 算法与 Qwen Plus 受约束摘要，不重算分数或生成诊断
  • 统一多端报告口径，落地个人四页报告、社区手机报告中心与四页 PDF
技术栈
  • Vue3
  • TypeScript
  • FastAPI
  • PostgreSQL
  • Redis
  • Docker Compose

TELES 工业产品海外独立站与 CMS

2026.07–2026.08

  • 建设英文 B2B 获客独立站：以内容仓库统一机床测头、对刀仪、测针三类产品，落地分类/详情路由、HTML 参数、兼容表、尺寸图与下载入口
  • 打通「产品选型 → 预选询盘 → 邮件通知 → 后台留档」闭环，支持附件上传、线索状态与 CSV 导出
  • 基于 Supabase 与 NestJS 搭建管理后台，维护产品、参数、下载、页面与 SEO 字段，配套账号权限、审计日志与内容校验
技术栈
  • Next.js
  • React
  • TypeScript
  • TailwindCSS
  • Supabase
  • NestJS
  • Ant Design Pro

AI 黄金定制

2025.06–2026.02

uni-app 多端 AI 文生图：提示词分组与推荐、生成与历史回填；Pinia 任务排队、轮询和跨页恢复。

  • 基于 uni-app + Vue3 + TypeScript 开发 AI 文生图定制多端应用，支持 H5、微信/支付宝小程序等多端构建与多环境发布
  • 负责 AI 文生图主流程：分类选择与多级提示词分组、提示词库与随机推荐、生成提交、历史回填与再次生成
  • 基于 Pinia 持久化实现生成任务管理，支持排队、进度轮询、结果同步、失败清理与跨页面任务恢复，保障异步任务可续接
  • 封装 API 适配、上传、滑动面板、AI 图片渲染等通用能力，支撑图生线稿、生成记录、点赞反馈等业务页面
技术栈
  • Vue3
  • TypeScript
  • uni-app
  • Vite
  • Pinia
  • flyio
  • SCSS
  • z-paging
AI 造镯首页设计稿，不是切图，也不是运行界面
手镯主元素/工艺选择设计稿，不是切图，也不是运行界面

其他项目

银行渠道黄金珠宝商城系统

2019.04–2026.02

Vue2/Vue3 双线与 3 端；「一货一码 SN」购买与三种金价计价；64 模块迁 Vue3 CMS + Playwright 真实后端冒烟（会员 smoke 40/40）。

展开详述
  • 主导银行渠道商城系统的建设与持续升级：同仓维护 Vue2 / Vue3 双线，隔离两套 workspace 保障旧线稳定迭代，Vue3 线覆盖 H5、微信小程序、支付宝小程序共 3 端，配套自研 uni-cli 脚手架与 deploy 部署 CLI
  • 主导「一货一码（SN）」购买链路：商品详情 SN 级联选择、购物车 SN 行锁定、确认订单实时金价计价与锁价、按 SN 拆行售后，统一定价 / 每日金价 / 实时金价三种计价方式的前端契约
  • 基于 Vben Admin + Turborepo 将商城后台 64 个线上功能模块按批次迁移至 Vue3 CMS（系统、广告、会员、财务、营销、商品），沉淀 11 个 @jmall/* 后台共享包，复用于平台、商城、供应商、内容 CMS 4 个后台
  • 基于 Playwright 建立小程序端 + 真实后端 e2e/冒烟体系，按路由与生成物、列表分页、HTTP 鉴权、平台差异、组件兼容 5 类行为契约，对 64 个模块的迁移做回归；会员模块真实后端 smoke 40/40 通过
技术栈
  • uni-app
  • Vue2/Vue3
  • TypeScript
  • pnpm workspace
  • Vite
  • Vben Admin
  • Turborepo
  • VxeTable
  • Playwright

Design Kit + Rigor

Design Kit 负责需求到设计的规格、探索、审查与交接；Rigor 提供基于 Trellis 的 TDD 证据门禁、独立审查与受控收尾。

展开详述
  • Design Kit：独立负责工作流建设，串联 PRD / UX 规格、视觉探索、独立评审与工程交接，并开发 Python 前置检查脚本校验交付材料
  • Rigor：基于 Trellis 扩展工程流程，以 Python 实现 TDD 证据门禁、独立审查与受控收尾；配套 Claude Code、Codex、ZCode 适配、安装校验与自动化测试
技术栈
  • Python
  • Trellis
  • Claude Code
  • Codex
  • ZCode

WebDevLib 前端工程化基础库

2019.06–2026.02

Monorepo、uni-cli / uni-router 多端工程工具、小程序发布流程与 Vite 构建插件。

展开详述
  • 搭建 pnpm + Lerna Monorepo，拆分 tools、uni-cli、uni-router 和规范配置等 npm 包，支持独立构建、版本管理与私有 npm 发布
  • 实现 uni-cli 自动生成 pages.json、路由映射和页面刷新配置，支持主包、分包及条件编译；封装 uni-router，统一页面跳转 API、导航守卫和小程序跳转
  • 基于 miniprogram-ci 封装微信小程序上传、预览二维码生成、sourceMap 拉取和编译产物导出；开发 vite-plugin-uni-compression 按平台、环境及时间压缩产物
  • 集成 TinyMCE 秀米插件，通过 postMessage、HTML Parser/Serializer 与图片 Blob 上传，实现第三方排版内容导入和图片资源转存
技术栈
  • TypeScript
  • Node.js
  • pnpm workspace
  • Lerna
  • Rollup
  • tsup
  • Vite Plugin
  • Vue3
  • uni-app
  • Vitest
  • miniprogram-ci
  • TinyMCE

@jyf/el-component 企业级后台通用组件库

2019.06–2026.02

配置化后台表单、表格和页面组件，配套 OBS 文件上传与富文本能力，复用于 11 个后台系统。

展开详述
  • 设计配置化表单、表格和页面组件，以 formConfig、tableLabel、filters 驱动渲染，支持筛选、分页、排序、操作栏、插槽扩展和权限过滤；复用于 11 个后台系统，标准 CRUD 页面开发压缩至 15 分钟
  • 封装全局配置中心，支持注入上传地址、OBS 密钥接口、权限列表和自定义请求实例，实现组件能力与业务系统解耦
  • 建设文件上传能力，支持 OBS 云端直传、本地服务器上传、大文件分片、暂停、取消、失败重传及格式/大小校验；封装 OBS 签名解密、缓存、过期校验和并发复用
  • 集成 TinyMCE 富文本编辑，支持自定义工具栏、字体配置和图片粘贴上传；配套 TypeScript 类型声明、VuePress 文档与 lint 提交流程
技术栈
  • Vue2
  • TypeScript
  • Element UI
  • Vue Composition API
  • Axios
  • TinyMCE
  • VuePress
  • Webpack
  • Sass

轻定制商品管理后台与可视化模板编辑器

2019.05–2026.02

Vue2 管理后台与 vue-fabric-editor 二次集成，覆盖复杂定制表单和可视化模板设计。

展开详述
  • 参与轻定制商品管理后台及可视化模板编辑器开发，覆盖商品库、组件库、素材库、规格价格、刻字/定制区域、包装配置和模板设计
  • 负责 Vue2 管理后台核心业务模块，封装定价、计价、定金、规格、包装、刻字/定制区域、组件排序等复杂表单数据组装，支持接口提交与编辑回显
  • 基于开源 vue-fabric-editor 二次集成模板编辑器，接入模板详情加载、模板 JSON 保存、自定义字体与 OBS 素材地址转换，并扩展 PSD 导入、字体预加载、画布尺寸、标尺/图层、裁剪、二维码/条码等能力
  • 处理 Fabric 模板 JSON 兼容问题及大型后台工程配置，改善模板复用稳定性、构建和调试体验
技术栈
  • Vue3
  • Vue2
  • TypeScript
  • Vite
  • Webpack
  • Fabric.js
  • Pinia
  • Vuex
  • Axios
  • pnpm workspace
  • OBS

黄金珠宝定制业务多端应用

2019.05–2026.02

展开详述
  • 轻定制模块基于 Fabric.js 实现商品画布编辑、刻字与模板分享
  • 基于 pnpm workspace 搭建定制业务多应用 Monorepo，承载主商城、超级门店、CRM、营销、钱包等 13 个小程序 / H5 应用与 2 个组件库，沉淀 request、router、store、locale、statistics 等 11 个公共库统一复用
  • 封装多端统一请求与路由层，覆盖 H5、微信小程序、支付宝小程序共 3 端，统一处理 token、终端标识、语言、机构/门店信息与业务异常码，支持登录拦截与页面栈降级
  • 拆分 marketing、wallet、web 3 个内嵌 H5 子应用（合计 54 页）承载营销活动、钱包支付等高频迭代模块；建设 22 个基础组件与业务组件库，通过 easycom 自动注册；主应用拆分 16 个分包承载 120+ 页面，结合图片懒加载、瀑布流增量渲染与统一埋点统计优化性能
技术栈
  • uni-app
  • Vue2/Vue3
  • TypeScript
  • pnpm workspace
  • uni-ui
  • vue-i18n
  • uCharts
  • Fabric.js
  • Vite

业务中台管理后台

2024.06–2024.12

Vben + micro-app；商品/营销/组织权限子应用与 21 个共享包；动态 SKU/属性与 VxeTable 二次封装。

展开详述
  • 基于 Vue3 + TypeScript + Vben Admin 二次集成业务中台前端，以 pnpm workspace + Turborepo 组织主应用、商品中心、营销中心、组织权限 4 个子应用与 21 个共享包
  • 基于 micro-app 实现主子应用通信（用户信息 / Token 下发、菜单同步、退出登录、锁屏等跨应用事件），并自研 @jyf/api、@jyf/micro、@jyf/composables 等共享包补齐 Vben 上游能力
  • 负责商品中心复杂配置能力：款式、SKU、属性、标签、编码规则与款式模板，实现动态属性表单、动态表格列、批量填充与条件显示
  • 二次封装 VxeTable 支持搜索表单、列显隐、拖拽与用户个性化配置持久化；实现 Excel/CSV 批量导入、导入报告下载、图片压缩包上传导出等文件处理能力，复用于商品、营销、组织权限列表场景
技术栈
  • Vue3
  • TypeScript
  • Vite
  • Pinia
  • Vue Router
  • Ant Design Vue
  • Vben Admin
  • VxeTable
  • Axios
  • micro-app
  • Turborepo
  • pnpm workspace
  • ExcelJS
  • Nginx

TOPCS 客服系统

2023.03–2023.05

基于 D2Admin 的在线客服系统，涵盖 IM 工作台、四套 Layout 路由、消息协议与跨窗口集成。

展开详述
  • 基于 D2Admin 二次开发企业级在线客服系统，覆盖坐席 IM 工作台和管理后台，支持 PC / 移动端及 Web 组件嵌入
  • 设计管理后台、IM 工作台、嵌入式、客户端四套 Layout 路由架构，实现页面隔离和业务复用
  • 实现会话列表、多类型消息渲染（10+ 种）、表情面板、公共/个人快捷回复和客户信息面板；以 TypeScript enum 管理 20+ 种消息类型、会话与在线状态协议
  • 通过 postMessage 接收宿主页面注入的用户、系统和 Token 信息；封装客户卡片、精确计算、AES 加解密与持久化工具
技术栈
  • Vue2
  • TypeScript
  • Composition API
  • Vuex
  • Element UI
  • D2Admin
  • Axios
  • lowdb
  • CryptoJS
  • Webpack
  • Sass

平安好车主 APP 活动页

2017.09–2018.03

8+ 个高互动活动页，包含 Canvas 射箭和年度驾驶报告；成果数字为简历自述。

展开详述
  • 主导平安好车主 APP 8+ 个高互动活动页开发（射箭游戏、健步行、年度驾驶报告等）
  • 基于 Canvas 实现弓箭轨迹与碰撞检测，操作流畅度提升 30%
  • 年度驾驶报告支持个性化生成与微信一键分享，二次传播率达 15%，活动转化率提升 20%
技术栈
  • Vue2
  • Canvas/SVG
  • touch 事件

工作经历

全栈开发

2026.06–2026.10

华力（深圳）投资控股集团有限公司

  • 负责公司官网、海外获客站及行业数字化产品的全栈开发与交付，覆盖 Web 产品与后台服务。
  • 建设研发规范与交付检查流程，落地 TDD 证据门禁，并适配 Claude Code、Codex、ZCode 三类 AI 工具。

前端开发经理

2019.03–2026.02

深圳金雅福控股集团有限公司

  • 带领 8 人前端团队（6 年团队管理），负责公司 50+ 个前端工程（管理后台、小程序、H5、数据大屏）的技术规划与落地
  • 从零搭建 Monorepo 工程化体系与自动化发布流程，统一 ESLint / Stylelint / Commitlint 规范、共享类型包与 Code Review 机制，推动其中 35+ 个前端工程接入统一规范
  • 设计并维护公司级组件库与 CLI 工具链，后台组件库复用于 11 个后台系统，CLI 工具链支撑 16 个 uni-app 项目，形成团队标准基建
  • 制定新人培养与梯队建设流程，统一团队交付规范与技术标准
工程体系示意：Monorepo 串联统一规范、组件库、CLI 工具链与自动化发布，支撑多端业务交付

H5 开发工程师

2018.03–2019.03

深圳市瑞福登信息技术服务有限公司

  • 基于 mpvue 以一套代码同时交付企业微信 H5 与微信小程序，避免双端重复开发
  • 封装高复用业务组件，团队开发效率提升 25%
一套代码双端交付示意：mpvue 与共享业务组件同时输出企业微信 H5 与微信小程序

H5 开发工程师

2017.09–2018.03

深圳市法本信息技术股份有限公司

  • 主导平安好车主 APP 8+ 个高互动活动页开发（射箭游戏、健步行、年度驾驶报告等）
  • 基于 Canvas 实现弓箭轨迹与碰撞检测，操作流畅度提升 30%
  • 年度驾驶报告支持个性化生成与微信一键分享，二次传播率达 15%，活动转化率提升 20%
  • 实现用户数据加密与接口签名机制，接口成功率稳定在 99.5% 以上
两张手机样机上的抽象 H5 布局，无品牌名

软件工程师

2016.01–2017.08

武汉佰钧成技术有限责任公司

  • 使用 Bootstrap、jQuery、Vue 开发响应式企业官网与管理系统
  • 独立封装 5+ 个通用功能模块，提升代码复用率 30%
笔记本电脑与抽象代码界面，无可读品牌与产品名

技术能力

语言

  • JavaScript
  • TypeScript
  • HTML5
  • CSS3
  • Sass
  • Less
  • Node.js
  • Python

框架/库

  • Vue2/3
  • React
  • Next.js
  • Pinia
  • Vuex
  • Vue Router
  • uni-app
  • micro-app
  • Element UI
  • Ant Design Vue
  • TailwindCSS
  • Fabric.js

工程化

  • Vite
  • Webpack
  • pnpm
  • Lerna
  • Turborepo
  • ESLint
  • Prettier
  • Stylelint
  • Husky
  • Commitlint
  • Jenkins

测试/运维

  • Vitest
  • Playwright
  • Docker Compose
  • Nginx

调试/工具

  • Chrome DevTools
  • Fiddler
  • Postman
  • Git

AI 工程

  • Claude Code
  • Codex
  • ZCode
  • Dify

教育背景

联系

如果你正在寻找能处理复杂业务、推动多端研发并关注工程化交付的开发者，欢迎联系我。

发送邮件 下载 PDF 简历