方浩

• 职位：前端开发

• 基本信息：男

  29 岁

  本科

  5 年经验

  深圳

• 联系方式：13058105004

  446379625@qq.com

技能掌握

• 有较扎实 JavaScript 基础，能够熟练使用 ES6 语法，熟练使用函数式编程思想；
• 熟悉 Vue 内部实现原理，熟练使用 Vue 全家桶及相应的 UI 框架开发项目，熟练使用 Vue3 开发前端项目；
• 熟悉 React 内部实现原理，擅长 Hooks + 函数组件编程；熟悉使用 Redux、Dva、Mobx 等主流 React 状态库；
• 熟练使用 Umi 进行 React + TypeScript + Redux + Antd 项目开发，对微前端项目有一定实践；
• 熟练使用 Echarts、FabricJS 等可视化库，并应用到大屏及绘图工具的开发；
• 熟练使用 uni-app 进行 H5、小程序、app 多端开发，能够处理多端协同及安卓与 IOS 兼容问题；
• 熟练使用 Git 版本管理工具，熟悉 Gitflow 工作流程；熟悉项目常规开发流程、开发调试技巧、发布部署步骤；
• 熟练使用 Gulp、Webpack、Vite 工程化构建应用，对前端工程化、组件化、模块化，自动化有一定的实践经验；
• 熟悉前端测试，能够使用 MockJS，Vitest、Jest 等进行数据模拟、单元测试、组件测试和端到端测试；
• 熟悉 Node 后端服务，能够使用 NestJS、Nuxt 搭建前端中后台服务；
• 熟悉 Docker，能够基于 Docker 实现前端项目容器化部署；
• 熟悉同构渲染，能够基于 Nuxt3 搭建前端服务端渲染服务，并应用到邮件渲染及 PPT 生成；
• 熟悉前端性能监控，能够结合 Sentry 对 web 项目进行数据分析和问题处理；
• 熟悉 Chat AI，能够基于 ChatGPT 大语言模型进行 D2C 插件开发，运用 AI 处理大部分开发需求及问题；

工作经历

深信服科技股份有限公司

• 职位：web 前端开发
• 时间：2021.12 - 2024.12
• 工作内容：
  1. 主导 Web 前端项目的管理与开发工作，以 Vue 生态技术栈为核心，深度配合产品线推进需求落地，统筹协调各项任务安排，确保流程有序高效；
  2. 带领前端团队开展工作，包括分配开发任务、评估技术难度与工作量，同时负责代码 PR 审核，并为团队成员提供技术指导与经验支持；
  3. 负责核心版本的交付保障，确保个人承接的版本任务保质保量完成，同步输出设计文档，推进目标拆解与项目复盘，持续优化开发流程；
  4. 聚焦前端技术演进，密切关注行业技术动态与升级方向，将前沿技术合理应用于业务场景，提升开发效率与产品质量；
  5. 主导推动前端技术体系建设，包括框架技术迭代、CICD 自动化流程搭建、服务端渲染落地、测试自动化实施及性能优化等，全面提升团队开发效率与交付质量；
  6. 负责网站性能与加载速度优化，通过 CDN 加速、Sentry 性能监控等手段，提升网页响应速度与稳定性，优化用户体验；
  7. 积极推动公共组件库建设，是开源 Iudx 组件库及 Vue3 Hooks 库的贡献者；
  8. 深耕前端服务端渲染能力建设，实现客户端与服务端同构渲染，支持服务端邮件 HTML 渲染及 PPT 生成等场景，拓展前端技术边界。

坎德拉 (深圳) 科技创新有限公司

• 职位：web 前端开发
• 时间：2020.11 - 2021.12
• 工作内容：
  1. 负责公司 PC 端 Web 项目的全生命周期管理，包括需求开发、功能迭代及后期维护，保障项目稳定运行；
  2. 搭建前端项目架构，完成请求配置、路由管理及用户权限体系搭建，支撑项目高效开发；
  3. 搭建前端微服务，使各个子项目相互关联，独立开发部署，降低项目间耦合度，提高开发部署效率；
  4. 编写前端自动化部署脚本，简化多人协作开发流程，提高团队整体开发效率；
  5. 负责数据大屏项目搭建，结合 Echarts 与 ThreeJS 技术实现 2D + 3D 数据可视化展示，提升数据呈现效果；
  6. 独立开发轻量版 Web 绘图修图工具，实现核心图像编辑功能，满足特定业务场景需求。

深圳华师兄弟教育科技有限公司

• 职位：移动 web 开发
• 时间：2019.03 - 2020.10
• 工作内容：
  1. 负责公司移动 Web 项目的开发、迭代及后期维护，确保项目的稳定性和用户体验的持续提升。
  2. 处理移动端安卓与 IOS 兼容问题，优化前端体验和页面响应速度，并保证兼容性和执行效率；
  3. 与后端程序员紧密协作，完成功能嵌套及调试，确保前后端无缝对接。
  4. 负责前端项目技术选型，结构设计与布局，编写可复用的用户界面组件，制定前端代码规范；
  5. 开发过多平台应用，包括课时宝 H5、秒课小程序及微电 App，推动项目在不同平台间的顺利实现。

项目经验

前端中后台服务端渲染项目 【深信服科技股份有限公司】

• 项目描述：该项目为前后端一体化服务，核心提供前端同构渲染能力及服务端邮件、PPT 自动化渲染功能。
• 技术栈：Vue3 + Nuxt3 + PptxGenJS
• 项目职责：
  1. 主导服务端架构搭建，独立设计基于 Nuxt3 的服务端渲染整体方案，包括目录结构标准化设计、状态管理策略制定、服务端接口封装规范确立及国际化方案落地；
  2. 负责前端同构开发与后端接口全流程实现，保障前后端数据交互高效可靠；
  3. 基于 PptxGenJS 开发服务端 PPT 生成模块，构建标准化接口供前端调用，实现 PPT 报告自动化生成；
  4. 设计服务端渲染的运营报告生成机制，提供接口支持后端调用，实现电子邮件报告的自动化输出；
• 项目成就：
  1. 通过服务端渲染方案的优化实施，显著缩减首屏白屏时间，大幅提升用户初始加载体验；
  2. 服务端自动化生成邮件报告功能上线后，减少运营人员 80% 的重复性工作，极大提升工作效率；
  3. 服务端 PPT 自动生成功能完全替代传统人工制作流程，显著提升报表生成效率与标准化程度；
  4. 总结项目实践经验，输出服务端渲染最佳实践手册，为团队后续相关项目提供重要参考；

公共组件库开发 【深信服科技股份有限公司】

• 项目描述：该项目是前端公共组件库开发，对内对外一致可用，向 Ant Design，Element-UI 看齐，要求标准较高。其中，组选择器组件专注于树形组织结构的高效筛选。
• 技术栈：Vue3 + Tsx + Idux-UI
• 项目职责：
  1. 主要负责复合组件组选择器的全流程开发，主导需求分析、技术方案选型、数据结构设计、交互流程规划及核心逻辑编码实现；
  2. 采用 “分层设计 + 配置化拓展” 架构，最大化提升组件在多业务场景下的复用效率；
  3. 基础层：封装三列布局结构、搜索过滤算法等核心通用逻辑，夯实组件功能基础；
  4. 业务适配层：通过 props 参数与插槽 (Slot) 构建灵活配置入口，支持业务方自定义选择器样式与交互逻辑；
  5. 拓展层：设计完善的钩子函数 (Hooks) 与事件回调机制，赋能业务方基于核心功能进行二次开发；
  6. 构建全链路测试体系，编写单元测试、Demo 测试及集成测试用例，保障组件稳定性；
  7. 撰写详尽的组件说明文档，明确通用边界与拓展接口，降低使用门槛；
• 项目成就：
  1. 功能丰富，支持基础表格选择以及高级多层树形结构选择，满足大部分业务需求场景；
  2. 易拓展，通过高内聚低耦合设计与丰富的开放配置，完美支撑开发者应对复杂业务需求的组件拓展；
  3. 高性能，支持大数据情况下复杂层级渲染以及数据处理，满足高可用的性能需求；
  4. 可复用，通过模块化与组件化设计，有效支持开发者在不同场景下的逻辑复用，显著降低开发成本；

DrawingTool 【坎德拉 (深圳) 科技创新有限公司】

• 项目描述：该项目为绘图修图工具 web 版，主要为方便业务人员对地图图片修改和处理；
• 技术栈：React + TypeScript + Mobx + FabricJS
• Demo：https://drawing-tool-ten.vercel.app
• 项目职责：
  1. 独立负责项目全流程开发，基于 FabricJS 进行绘图功能深度开发；
  2. 实现画布自由移动与缩放功能，同时不影响绘图过程操作；
  3. 开发直线，画笔，直尺，矩形，折线，椭圆，正圆，多边形等基本工具，支持对象创建、复制、删除、编辑、调色等操作；
  4. 设计折线多点编辑机制，实现点位精确调整与回撤功能，支持上一步 / 下一步精细化操作；
  5. 构建历史记录系统，实现对象操作的实时回撤与还原功能；
  6. 开发图片裁剪功能，支持图片自定义裁切、复制等操作；
  7. 对点位信息进行跟踪记录，支持保存点位信息到云端，并不直接输出到图片上，方便下次继续写入操作；
  8. 采用模块化设计思想拆分核心逻辑，实现功能解耦与独立导出，提升代码可维护性与复用性；
  9. 分离响应式与非响应式状态管理，避免绘图操作时产生无意的视图刷新，优化交互体验；
  10. 实现工具类与业务逻辑分离架构，通过乾坤微服务模式关联业务系统，降低耦合度，保障独立高效开发迭代；

Radiance 【坎德拉 (深圳) 科技创新有限公司】

• 项目描述：该项目为公司内部调度系统后台管理；
• 技术栈：React + Umi + Antd + TypeScript + Dva + Vue2
• 项目职责：
  1. 主导前端项目从 Vue 到 React 的技术栈迁移，负责整体架构搭建与核心开发工作，保障迁移过程平稳过渡；
  2. 采用 React Hooks + Ts + 函数组件模式进行开发，制定并推行统一的多人协作编码规范，显著提升代码可维护性与健壮性；
  3. 定义 API 接口规范，封装统一的请求函数，处理请求和响应阶段的验证与数据处理 (如用户身份验证，权限验证)；
  4. 自定义用户认证时效，实现用户 Token 过期后，一定时间内非跳转登陆自动刷新认证信息，优化用户体验；
  5. 建前端微服务架构，基于乾坤框架实现子项目的统一管理、数据共享与独立开发部署，有效降低项目耦合度，提升团队开发与部署效率；
  6. 完善 CI/CD 流程，开发 OSS 部署插件，结合 umi hooks 实现自动化部署，并对接企业微信机器人，实现部署信息实时同步至工作群；
  7. 基于 Canvas 开发楼层 2D 可视化地图，支持桩位、闸机等点位的精准展示，实现机器人实时位置追踪与运动轨迹可视化；
  8. 设计动态主题系统 (支持纯白 / 雅黑模式)，实现运行时主题无缝切换及 Antd 组件库主题的深度定制；

Aurora 【坎德拉 (深圳) 科技创新有限公司】

• 项目描述：该项目为公司内部数据分析平台，主要负责数据可视化展示；
• 技术栈：React + Umi + Antd + TypeScript + Echarts + Mobx + AMap + Kotlin
• 项目职责：
  1. 全面负责项目全生命周期管理，涵盖架构搭建、核心开发、测试优化、迭代升级及后期维护，保障项目稳定运行与持续演进；
  2. 封装标准化 ECharts 组件库，实现统一调用接口，满足多样化图表可视化展示需求，提升开发效率与界面一致性；
  3. 开发全国地区多级可视化系统，支持从国家、大区、省、市、区到园区的六级地理层级无缝切换与数据展示；
  4. 开发在 Echart，BMap，以及室内 Canvas 三种不同方式的热力图呈现；
  5. 跨栈参与后端开发，使用 Kotlin 编写热力图相关接口，通过前后端协同开发模式，强化技术衔接与功能落地效率；
  6. 设计日 / 周 / 月多维度图表日报系统，实现多类型图表批量导出为高分辨率图片功能，满足数据汇报场景需求；
  7. 主导地图 API 技术选型调研，完成从百度地图 (BMap) 到高德地图 (AMap) 的平滑迁移，并解决不同地图坐标系的精准转换问题；

课师宝 H5 【深圳华师兄弟教育科技有限公司】

• 项目描述：该项目基于 uni-app 结合 Vue 与小程序相关 API 开发的线上知识付费平台；
• 技术栈：Uni-app + Vue2 + Vuex
• 项目职责：
  1. 主导项目技术选型与架构搭建，独立完成基础功能开发及核心业务逻辑实现，支撑项目从 0 到 1 落地；
  2. 深度优化跨端兼容性，针对性解决安卓与 iOS 平台适配问题，对主流机型进行专项性能调优，保障一致的用户体验；
  3. 制定前端开发规范体系，包括封装通用校验工具、构建可复用组件库、标准化请求接口，规范多人协同开发流程，提升团队协作效率；
  4. 开发课程购买、内容付费、会员体系等核心模块，深度集成微信支付能力，保障交易流程稳定可靠；
  5. 设计前端状态管理方案，优化数据流转逻辑，实现复杂业务场景下的状态精准控制，提升应用响应速度；

教育背景

• 学校：洛阳理工学院
• 学历：本科・统招
• 时间：2015.09-2019.07

附件

• 简历