张育华的求职简历
React 与 React Native 多端开发、公共请求治理和跨境电商项目经验。
张育华
基本信息 · 模块规则
- 目的:让读者识别求职方向并联系你。
- 记录:姓名、求职方向、已确认的年龄、现居城市、学历专业与联系方式。
- 不记录:技能清单、项目细节及未确认的年限、薪资或到岗时间。
- 理由:页首集中提供定位和联系信息,经历与能力由后续模块说明。
求职方向:前端开发工程师
26 岁|现居深圳|本科 · 软件工程
电话:13680905763|邮箱:zhangyhuatv@gmail.com
职业概述
模块规则
- 目的:快速呈现职业背景与代表性经验。
- 记录:主要技术方向、业务领域、承担范围及简要协作经历。
- 不记录:完整技能清单、具体业务流程、实现步骤或泛泛自我评价。
- 理由:先给整体背景,帮助读者理解后文,避免完整复述工作与项目经历。
以 React / TypeScript 为主要技术方向,先后参与物流 TMS、仓库 PDA 及跨境电商平台建设,开发范围覆盖 PC、H5 与移动端。工作内容从业务页面开发、接口联调及上线问题处理,逐步扩展到多端业务复用、公共请求治理、移动端稳定性与构建发布,并有新人带教、技术方案把关及代码评审经历。
技术能力
模块规则
- 目的:让读者快速判断能力与岗位的匹配程度。
- 记录:技术工具及对应的开发能力范围。
- 不记录:订单嵌套、401 规则、ACK 等具体业务或实现细节,不以项目依赖推定熟练度。
- 理由:技能应能跨项目理解,具体做法和效果交给项目经历支撑。
- Web 开发: HTML5、CSS3、JavaScript(ES6+)、TypeScript;使用 React、Next.js、Umi 开发业务页面、封装公共组件并进行国际化与多语言适配;使用 Ant Design、HeroUI 等 UI 组件库,使用 Tailwind CSS 实现界面样式,通过 ECharts 展示业务统计数据。
- 状态、请求与通信: 使用 TanStack Query 管理接口数据与缓存,使用 Zustand 管理客户端状态;具备基于 Axios 的请求封装、鉴权与错误处理,以及 WebSocket 连接管理与消息处理实践。
- 工程化与复用: 使用 pnpm + Turborepo 管理 Monorepo,具备 UI 与业务逻辑分离、共享业务与类型抽取、平台适配及跨端业务复用实践;使用 Git 进行版本管理与团队协作,具备代码规范检查与提交校验实践。
- 测试与发布: 具备单元测试、Playwright 端到端测试、云效 CI/CD 及 Web 发布回退实践;有 EAS 多环境构建及 Android / iOS 应用提审发布经历。
- 移动端与设备接入: 具备 React Native / Expo、Vue 3 / uni-app 开发实践,涉及 Android / iOS 兼容排查、WebView 交互、PDA 广播扫码、图片与视频采集上传,以及 UTS 原生图片处理与桥接。
- AI 协作: 编写项目开发规则,使用 Codex 按规范辅助业务开发与重构,并结合代码审查、类型检查和测试核验改动。
工作经历
模块规则
- 目的:说明真实职业轨迹及在公司的责任范围。
- 记录:公司、任职时间、实际岗位、工作范围与招聘带教等协作职责。
- 不记录:单个项目的详细实现过程、重复功能清单或未经确认的管理职级。
- 理由:这里交代在哪家公司承担什么职责,具体怎样完成由项目经历展开。
深圳市包包达软件技术服务有限公司
2025.04—至今|前端开发工程师
- 承担 BBDBUY 平台(PC、H5、React Native App)、运营后台及仓库 PDA 的主要前端建设与迭代。
- 参与前端招聘面试与候选人筛选,团队后续由 1 人扩充至 3 人;负责新人带教、任务分配、技术方案把关与代码评审。
- 针对当时租用的第三方 SaaS 系统缺少可用接口的问题,开发浏览器扩展,支持订单匹配、物流单号采集与批量回填。
深圳新智慧物流科技有限公司
2022.04—2024.03(约)|前端开发工程师
- 参与 TMS 业务后台与仓库 PDA H5 页面开发,负责业务迭代、接口联调及上线问题处理。
项目经历
模块规则
- 目的:用具体案例说明实际工作与贡献。
- 记录:业务背景、个人负责范围、代表性问题、处理方式及已确认的验证或结果。
- 不记录:全部功能清单、逐行代码讲解,以及未经确认的独立主导、上线效果或收益数字。
- 理由:问题、做法和结果能支撑技能,业务规模与个人成果需要区分。
BBDBUY 跨境电商平台
项目简介 · 编写规则
- 目的:让读者先理解项目面向谁、运行在什么平台、承载什么业务及规模。
- 记录:服务对象、三端与多语言、正式上线时间、带统计时点和范围的业务规模,以及主要业务链条。
- 不记录:个人实现细节、全部功能清单,以及未经确认的活跃、并发、性能或个人增长成果。
- 理由:海外用户、三端和多语言交代使用场景;上线时间与累计量说明实际运行背景;业务链条为后文 SKU、交易和客服案例提供上下文。订单与运单为新系统累计量,用户为平台累计量,规模不直接归因于个人工作。
面向海外用户的跨境代购与国际集运平台,覆盖 PC、H5 与 React Native App,支持多语言。新系统于 2026 年 5 月正式上线,接替原有系统;截至 2026 年 10 月,新系统累计订单约 49 万、运单约 4.5 万,平台累计用户约 16 万。业务覆盖商品代购、订单结算与支付、仓储合箱及国际物流,配套钱包、退款和客服功能。
个人职责 · 编写规则
- 目的:明确本人在这个项目中承担的范围与阶段。
- 记录:上线初期的前端开发、部署与自测责任,以及后续三端迭代和工程整合。
- 不记录:具体技术步骤、工作经历中的招聘带教细节,以及未经确认的职级、后端责任或全程独立完成。
- 理由:项目简介说明平台背景,这里补清本人实际承担的工作,后续条目再展开具体做法。区分初期与后续,保留初期基本独立承担的事实,也符合后来团队扩充的情况;自测不扩大为全部自动化测试均由本人编写。
个人职责: 上线初期基本独立承担平台前端开发、部署与自测,后续持续负责三端迭代与工程整合。
技术栈 · 编写规则
- 目的:让读者快速识别这个项目使用的主要技术。
- 记录:与后续项目案例对应的框架、样式、状态请求、工程、测试及交付工具。
- 不记录:全部依赖、工具的逐项定义,以及仅凭依赖存在推定的个人熟练度。
- 理由:集中提供技术入口,后续条目把篇幅用于具体工作;与技术能力栏各有用途,这里限定为本项目的技术组合。
技术栈: TypeScript、React、Next.js、React Native / Expo、Tailwind CSS、TanStack Query、Zustand、WebSocket、pnpm + Turborepo、Playwright、EAS、云效 CI/CD。
三端前端架构与业务复用 · 编写规则
- 目的:概括本项目的整体前端架构,为后续请求、SKU、交易和聊天等案例提供共同背景。
- 记录:简述 React 体系内的框架取舍、Next.js App Router 的路由布局与页面元信息用途、公共页面预渲染的能力基础,以及 React Native / Expo 的 iOS 和 Android 平台范围;继续记录 Monorepo 的工程组织、公共业务分层、端侧依赖边界、数据归属及分阶段 Figma 界面改版中的业务复用。
- 不记录:脱离本项目的框架优点清单、未经确认的原始选型过程或完整框架对比,不将框架提供的预渲染能力写成已完成首页或商品 SSR、SSG/ISR 策略及首屏/SEO 收益;不展开全部目录、内部配置及后续条目的具体请求或支付规则,也不新增独立架构主导、效率指标、全仓一致或三端 UI/Token 全量完成结论。
- 理由:框架部分简述选型、主要用途与平台分工,为后面的工程组织、职责、依赖和数据归属留出篇幅。技术栈列出工具,这里概括工具用途;语言资源、币种偏好与登录标记的初始化细节保留在修改上下文,具体登录准入与会话处理由第二条展开。公共页面预渲染只作为框架能力与选型考虑,待完善内容和验证方向也留在上下文。Monorepo 说明工程组织,端侧适配说明共用业务如何服务三端,界面改版体现实际复用。第一条作为架构概述是本项目当前的表达取舍,不要求其他项目照搬。
- 三端前端架构与业务复用: PC/H5 选用 React 体系的 Next.js App Router,统一组织路由、布局与页面元信息,并为公共页面预渲染提供基础;App 采用 React Native / Expo 覆盖 iOS、Android。将三端独立工程整合为基于 pnpm + Turborepo 的 Monorepo,公共业务按领域组织,分离接口访问、查询缓存与业务编排;公共业务不直接依赖端侧 UI 和路由,由各端适配导航、反馈与平台能力。使用 TanStack Query 管理接口数据,Zustand 保存需跨页保留的流程标识与用户编辑值,临时交互状态局部维护;复用已有业务,借助 AI 按 Figma 设计稿分阶段重构 PC、H5 与 RN 界面。
公共请求与会话管理 · 编写规则
- 目的:说明三端请求传输与查询管理的分工、统一请求策略,以及按平台处理登录准入、会话失效与账号隔离的方式。
- 记录:简述 Axios 公共请求层与 TanStack Query 的协作,交代响应解析、错误分类、查询缓存与取消、读取对可恢复错误的有限重试、写入幂等重试;继续记录 PC/H5 的 Cookie 会话与服务端路由预检、RN 的登录态查询与客户端路由守卫,以及并发 401 去重和退出换号清理。
- 不记录:工具的通用原理、全部配置与错误枚举、Cookie 参数、路由清单、内部实现名和逐项测试细节;不把查询管理、登录跳转与账号清理全部归给 Axios,也不将路由预检扩大为完整权限校验,或扩大为所有 401 都退出、取消已提交写入、本人负责后端认证及全部写接口的幂等保证,不添加未经确认的线上收益。
- 理由:第一条概括整体架构和数据归属,这里先点明 Axios 的传输职责与 TanStack Query 的查询管理,再展开具体请求与会话规则,让工具和做法有明确对应;同一技术名在不同层级说明不同用途,可以保留。统一响应和错误,便于三端按同一约定处理;读取有限重试用于暂时故障恢复,同次写入重试复用请求 ID 以便后端识别并返回原结果;PC/H5 与 RN 的准入方式体现平台差异,RN 区分请求异常与未登录,避免错误跳转;并发 401 只处理一次以免重复执行失效动作,退出换号清理用于隔离前后会话。
- 公共请求与会话管理: 基于 Axios 封装三端公共请求层,统一响应解析与错误分类;结合 TanStack Query 管理查询缓存与取消,读取仅对可恢复错误有限重试。对支持幂等的写入接口,同次操作重试复用原请求 ID,由后端识别并返回原处理结果。PC/H5 接入后端 HttpOnly Cookie 会话,在服务端预检受保护路由;RN 通过用户信息查询与客户端路由守卫控制页面准入,区分未登录与请求异常。同一会话的需登录请求并发返回 401 时,只处理一次登录失效;退出或切换账号时取消旧查询、清理缓存和相关页面状态。
SKU 规格联动 · 编写规则
- 目的:以商品选购中的规格、展示与数量联动为代表案例,说明从选择有效组合到更新选购状态、再到购买前校验的处理,承接前两条的架构和公共请求基础。
- 记录:位运算枚举有效 SKU 的规格子集并构建组合索引(Path Map),支持任意顺序选择与反选、动态禁用无效或无库存选项;规格图片、SKU 价格与数量范围联动,切换 SKU 后按起购量及可用库存调整已有数量,以及加购和立即购买前的完整规格与数量条件校验。
- 不记录:完整算法推导、全部字段与兼容分支、商品详情全部功能或 UI 实现步骤;不因代码存在兼容分支就将其写成真实的多平台适配经历,不新增未经确认的算法原创、复杂度或性能收益、完整测试覆盖。展示价格联动不扩大为后端实时计价,图片联动不写成三端相同的主图库行为;前端校验不扩大为实时库存同步、后端锁库存或防超卖保证,局部刷新与本地状态分离细节留作面试展开。
- 理由:位运算枚举与组合索引交代有效组合的处理方法,任意顺序选择、反选及动态禁用说明用户选择时的行为。规格图片、SKU 价格和数量范围把选择结果落实到选购状态,数量校正说明切换 SKU 后怎样处理已输入数量;提交前校验补足购买动作的条件。正文保留这一条选购链路,具体字段、折扣价优先规则、三端图片展示差异及库存缺失时的边界保存在修改上下文。
- SKU 规格联动: 通过位运算枚举有效 SKU 的规格子集,构建组合索引(Path Map),支持任意顺序选择与反选,动态禁用无效或无库存选项;联动规格图片、SKU 价格和数量范围,切换 SKU 后按起购量与可用库存调整购买数量,并在加购、立即购买前校验完整规格及数量条件。
结算与支付流程 · 编写规则
- 目的:概括从结算到支付结果确认的前端工作,说明流程复用、跨端接入和结果处理。
- 记录:购物车与立即购买共用结算流程,按结算标识组织 Query Key、隔离预览缓存并定向清理;Web 跳转与 RN WebView 支付、服务端计价及计价或提交期间禁用按钮;支付回跳、有限轮询、达到上限仍未确认时手动重查,以及确认后刷新订单、运单与钱包数据。
- 不记录:订单类型、预览编号的字段细节、全部缓存键、精确清理调用和有效预览的逐项判断、渠道参数及提交状态字段,这些保留在修改上下文供面试展开;不把 Query Key 组织包装为算法创新,不将按钮禁用扩大为函数互斥、后端幂等或防重复扣款保证,不把退出结算写成取消后端订单,不把轮询达到上限写成支付失败,也不新增后端资金、验签、对账或未经确认的收益与验证结论。
- 理由:Query Key 与结算标识配合说明缓存及清理范围怎样限定,有限轮询与上限后手动重查说明结果确认的边界;两组方法分别对应结算与支付,形成具体技术依据。平台接入、金额与按钮限制继续简述,不恢复全部身份字段和内部状态。保留有用途的关键方法,同时控制协议和字段层级;金额仍以当前有效的服务端预览为依据,精确清理与未实施的代码计划继续记在上下文。
- 结算与支付流程: 复用购物车与立即购买的结算流程,按结算标识组织 Query Key,隔离预览缓存并定向清理。适配 Web 跳转与 RN WebView 支付,以服务端计价为准,计价或提交期间禁用支付按钮。处理支付回跳与有限轮询,达到上限仍未确认时支持手动重查,确认后刷新订单、运单与钱包数据。
三端客服聊天 · 编写规则
- 目的:用三端客服聊天案例,说明共用能力、消息发送处理、咨询切换与断线恢复。
- 记录:WebSocket 三端共用流程、历史与实时消息合并去重;本地回显、发送确认(ACK)后更新状态、超时重发复用原客户端消息 ID 并配合后端幂等;切换咨询时取消旧历史请求、校验会话,以及断线重连和恢复后的消息补拉。
- 不记录:两种消息 ID 的完整分工、回包替换步骤、后端幂等合同细节、请求序号、图片任务回调及具体重连参数,这些保留在修改上下文供面试展开;不把 ACK 等同于已读、超时等同于服务端未收到,不将去重或同 ID 重发扩大为已确认的后端仅处理一次、消息必达、任意断线全部补齐或严格有序保证,不新增未经确认的测试、上线、收益或个人主导结论。
- 理由:本地回显、ACK 与同 ID 重发属于同一条发送链路,分别说明发送反馈、确认和超时恢复;配合用途保留关键方法,比单列“发送状态、失败重发”更具体。正文只出现一种客户端消息 ID,不再并列展开服务端 ID、图片回调和请求序号;合并去重、咨询切换和重连补拉继续概括,图片及业务卡片细节留作面试素材。仍按本人指定的新方案采用完成式表达,实际尚未改造、后端约定待确认及未验证范围分别记录在修改上下文。
- 三端客服聊天: 基于 WebSocket 实现三端共用聊天,合并历史与实时消息并去重。消息先本地回显,收到发送确认(ACK)后更新状态;超时重发复用原客户端消息 ID,配合后端幂等处理。切换咨询时取消旧历史请求并校验会话;支持断线重连及恢复后的消息补拉。
RN 兼容与稳定性 · 编写规则
- 目的:通过跨端交互适配、启动兼容排查和 Android 标签页改造,说明 RN 开发中怎样处理平台差异及稳定性问题。
- 记录:双端安全区适配及按实测底栏高度配置键盘避让;依据启动日志排查 Hermes 兼容问题,对齐运行时与编译配置;针对 Android 标签页崩溃,移除原生分页器,仅渲染当前页并支持横滑切换,子区域横滑时暂停外层切页手势。
- 不记录:完整键盘库名、具体组件/API 名、底栏随键盘移动、手势结束或取消后的恢复与释放细节、全部页面和设备清单、触点集合与嵌套计数、构建开关和依赖版本,这些留在修改上下文;不将库提供的输入定位和自动滚动写成自行实现的算法,不把可疑崩溃路径写成唯一确诊根因,不把代码或配置已调整等同于 Release / 灰度验证完成,也不新增崩溃率、性能收益或全设备兼容结论。
- 理由:按安全区与键盘适配、Hermes 启动排查、标签页改造组织三句,键盘部分保留底栏实测高度与配置依据,父子横滑协调并入标签页方案,合并组件、间距和遮挡目的的解释,减少平台范围的重复。保留日志排查、配置对齐及分页器替代等关键方法;双端指 iOS / Android,当前页指当前激活标签的内容,完整工具名和参数留在修改上下文。现有实现、文档诊断和待完成 Release / 灰度验证继续区分,不新增技术亮点、唯一根因或验证成果。
- RN 兼容与稳定性: 适配双端安全区,按实测底栏高度配置键盘避让。根据启动日志排查 Hermes 兼容问题,对齐运行时与编译配置。针对 Android 标签页崩溃,移除原生分页器,仅渲染当前页并支持横滑切换;子区域横滑时暂停外层切页手势。
线上问题排查 · 编写规则
- 目的:以浏览器翻译事故和 RN 密码回填后表单重置两个线上案例,说明问题出现后怎样排查根因并修复;本人已明确确认表单问题在线上发现后由本人排查定位。
- 记录:依据错误页埋点的 DOM 异常定位 Chrome 自动翻译改写节点引发的 React 更新崩溃,在 PC/H5 限制自动翻译并保留站内多语言;RN 密码回填后表单重置的原因是前台恢复时鉴权刷新导致表单卸载重建,通过调整登录入口守卫的渲染条件,在后台校验期间保持表单挂载及输入状态。
- 不记录:未经确认的精确异常、日志字段、完整复现回归、其他监听、收益数字及个人独立主导;不将历史埋点扩大为完整线上监控,不将翻译限制扩大为阻止全部插件或覆盖 RN。RN 的完整 AppState、Query 与 Slot 调用链及状态条件留在上下文,不把普通重渲染写成必然丢失输入,不称每次回前台都会重查,也不写关闭鉴权刷新、所有密码服务均已验证或编造设备与系统版本。其他监听继续待回忆,检索未找到不等于历史从未接入。
- 理由:翻译案例保留 DOM 异常线索、外部节点改写与处理方式;RN 案例按“表单重置、卸载原因、守卫修复”组织,突出已确认的线上排查经历。压缩重复引导语,保留“卸载重建”、守卫渲染条件及后台校验期间保持挂载,避免被理解为普通重渲染或关闭鉴权。第六条已有 RN 兼容与稳定性内容,不因平台相同就排除本例,应比较具体问题、排查过程与处理方式是否重复;不以隐蔽程度或线上发生本身替代案例价值判断。完整调用链、具体调试和回归范围留在上下文。
- 线上问题排查: 依据错误页埋点的 DOM 异常,定位 Chrome 自动翻译改写节点引发的 React 更新崩溃;PC/H5 限制自动翻译,保留站内多语言。修复 RN 密码回填后的表单重置:前台恢复时鉴权刷新导致表单卸载重建;调整登录入口守卫的渲染条件,后台校验期间保持表单挂载及输入状态。
测试与构建发布 · 编写规则
- 目的:按测试验证、Web 发布、RN 发布组织功能开发之外的工作,说明代表性规则如何验证,以及 Web 和原生 App 怎样构建、交付和更新。
- 记录:请求取消、会话清理及结算状态隔离的单元测试,PC/H5 Playwright 端到端用例;云效 CI/CD、standalone 制品的版本目录与软链接切换、健康检查及失败回退,以及重建测试环境 PM2 进程定义以修复发布后仍运行旧代码的问题;RN EAS 构建发布流程、双端提审发布、按运行时兼容范围与通道管理 OTA,原生变更升级版本并重新打包。双端指 Android / iOS。
- 不记录:全部测试名称、工具和命令、部署目录、PM2 script/cwd 字段及 EAS Profile 参数;不将存在用例写成完整覆盖或本轮执行通过,不将构建入口写成已自动运行全部单测和端到端测试的发布门禁,不将 Mock 或开发环境支付预览写成真实付款验证。健康检查不扩大为业务验收或零停机保证,PM2 案例不改称生产事故或每次发布都重建进程;不把 EAS 构建写成自动完成商店审核,也不把 OTA 写成可更新原生能力,不新增灰度、回滚演练、全部商店审核通过或量化收益。个人测试与发布职责仍按已有来源界定。
- 理由:每组就近交代工具与用途,测试保留代表规则和 Playwright,Web 对应云效,RN 对应 EAS,减少先总述工具再分别展开的重复。版本目录、软链接、健康检查与失败回退说明发布方法,PM2 以“重建进程定义”补清已有案例的修法。双端提审保留平台交付经历,OTA 兼容范围与原生变更重打包说明更新边界,不为缩短而删去。Node 内置测试工具、完整排查步骤、首次接管回退和配置参数留在上下文,不继续堆叠工具名或新增实施与验证结论。
- 测试与构建发布: 为请求取消、会话清理及结算状态隔离配套单元测试,补充 PC/H5 Playwright 端到端用例。建设云效 CI/CD 流程,Web 按版本目录部署 standalone 制品,以软链接切换版本,配套健康检查与失败回退;重建测试环境 PM2 进程定义,修复发布后仍运行旧代码的问题。建设 RN EAS 构建发布流程并承担双端提审发布;按运行时兼容范围与通道管理 OTA,原生变更升级版本并重新打包。
BBD 跨境电商运营管理后台
项目简介 · 编写规则
- 目的:说明后台与 BBDBUY 跨境代购、国际集运业务的关系,以及内部使用岗位和主要业务范围,为后续项目案例提供背景。
- 记录:采购、仓储、客服与财务团队;订单采购、入库验货、出库发货及客服售后主线,以及会员与财务管理、营销和物流配置、仓储作业统计。
- 不记录:全部菜单、页面数量、逐项实现细节及未经确认的后台上线日期、业务规模或效率指标;不沿用三端平台的用户与订单规模作为后台独立成果,也不将项目功能范围等同于本人逐项独立建设。
- 理由:先明确后台服务的业务及使用对象,再以履约主线和运营管理能力概括范围。将仓储细分步骤收为入库验货、出库发货,为其他主要业务留出篇幅;活动、优惠券、线路和运费模板等归入营销和物流配置,具体方法与个人贡献由后续条目说明。
服务于 BBDBUY 跨境代购与国际集运业务的内部管理平台,面向采购、仓储、客服与财务团队。覆盖订单采购、入库验货、出库发货及客服售后,提供会员与财务管理、营销和物流配置及仓储作业统计。
个人职责 · 编写规则
- 目的:明确本人在后台项目中的前端责任范围。
- 记录:已有工作经历确认的后台主要前端建设与迭代,结合本人补充的 Ant Design / Pro Components 业务组件定制经历,按业务页面开发、业务组件定制与复用及前端工程优化概括工作范围。
- 不记录:逐项业务功能和具体实现步骤,以及未经确认的全程独立完成、后端职责、全部验证或上线效果;不把三端平台上线初期的人员情况直接套到后台,也不由“工程优化”扩展出新的建设范围或收益。
- 理由:职责行集中交代承担范围,保持表达层级一致。订单分层展示、物流编辑及售后表单说明业务界面和组件工作,登录依赖拆分、按需加载及发布制品检查说明工程优化;具体案例在后文展开,方案、验证及上线分工按既有来源界定。组件定制不等于修改组件库源码或建设完整组件库。
个人职责: 承担后台主要前端建设与迭代,负责业务页面开发、业务组件定制与复用及前端工程优化。
技术栈 · 编写规则
- 目的:集中提供后台项目的主要技术入口。
- 记录:React、TypeScript、Umi Max,以及表格、通信、图表、拖拽和条码案例实际使用的工具。
- 不记录:全部依赖、版本及配置项,不仅凭依赖存在推定熟练度或新增个人职责。
- 理由:工具清单帮助识别项目技术组合,正文结合用途说明 ProTable、EditableProTable、React DnD、JsBarcode 和 ECharts。客服独立条目转为候选后,实际使用的 WebSocket 仍保留,连接与复用细节见修改上下文;不照搬三端项目的框架、状态方案或条目数量。
技术栈: React、TypeScript、Umi Max、Ant Design、Ant Design Pro Components、WebSocket、ECharts、React DnD、JsBarcode。
后台工程组织与公共能力 · 编写规则
- 目的:概括后台的工程组织与公共能力,为后续业务案例提供基础。
- 记录:基于 Umi Max 组织路由、布局与业务页面,统一请求配置、公共请求头和异常提示,处理登录态初始化与失效跳转。
- 不记录:订单与商品嵌套表格等具体业务页面细节、完整框架选型论证、全部配置与请求头字段及错误枚举;不将前端登录检查扩大为完整鉴权或权限体系,不套用三端项目的请求治理能力,也不新增独立架构设计、性能或验证成果。
- 理由:后台作为主项目的补充,第一条保留短版,交代工程基础;不再展开请求拦截、401 和 getInitialState,以减少与主项目公共请求及会话案例的重复。第二条展开订单与采购业务组件,第六条说明依赖拆分和发布检查,具体实现及个人验证范围保存在修改上下文。
- 后台工程组织与公共能力: 基于 Umi Max 组织路由、布局与业务页面,统一请求配置、公共请求头和异常提示,处理登录态初始化与失效跳转。
订单分层展示与采购物流编辑 · 编写规则
- 目的:用订单分层展示和采购物流编辑,说明基于现有组件处理关联数据、编辑交互与业务约束的前端工作。
- 记录:ProTable 与 Table 组织订单、商品层级;基于 EditableProTable 定制物流编辑,接入商品规格与数量选择,处理已有包裹回填、编辑值同步及提交数据转换,跨物流记录汇总商品分配数量并校验采购上限,复用于采购和验货页面。
- 不记录:全部列配置、字段映射及 React API,不把组件定制扩大为修改 Ant Design Pro 源码、统一表格引擎或完整组件库;不新增跨级勾选、虚拟滚动、性能收益、全量分配保证或后端库存控制,源码观察不等于逐项独立设计和已验证成果。
- 理由:订单与商品分层提供业务背景,物流编辑作为主体,呈现回填、编辑、取值、校验和复用的完整过程。EditableProTable 说明实现依托,跨行汇总说明关键约束;value/onChange、暴露校验方法及未保存行拦截留作面试素材,避免把正文写成组件 API 清单。
- 订单分层展示与采购物流编辑: 使用 ProTable 与 Table 按订单、商品层级组织数据;基于 EditableProTable 封装物流编辑组件,支持商品规格与数量选择、已有包裹回填、编辑值同步及提交数据转换。跨物流记录汇总商品分配数量并校验采购数量上限,复用于采购和验货页面。
仓储分箱与条码作业 · 编写规则
- 目的:以库存包裹分配到出库箱的交互,说明拖拽、扫码输入、分配状态和条码输出的处理。
- 记录:React DnD 拖拽分箱,拖拽与扫码共用包裹分配逻辑,支持箱间移动及移回待分配区;提交前检查未分配包裹和空箱,使用 JsBarcode 生成条码并支持批量打印与补打。
- 不记录:全部仓储页面、拖拽事件与打印模板细节;不把扫码能力归给 React DnD,不把分箱规则扩大为最优装箱算法、后端库存锁定、全链路防重或效率收益,也不将 PDA 的现场作业能力计入后台组件。
- 理由:包裹分配是与表格编辑不同的交互案例。共用分配逻辑交代两个操作入口如何更新同一份状态,提交校验和条码输出补足操作过程;重复扫码提示、Code 128 制式和移除箱体的处理留在修改上下文。“分箱”明确指实物包装分配。
- 仓储分箱与条码作业: 基于 React DnD 实现拖拽分箱,拖拽与扫码共用包裹分配逻辑,支持箱间移动及移回待分配区;提交前检查未分配包裹和空箱,使用 JsBarcode 生成条码,支持批量打印与补打。
售后表单与批量处理 · 编写规则
- 目的:以采购平台售后表单和客户退款批量操作,说明渠道规则差异、字段联动及可操作对象筛选。
- 记录:按淘宝、1688、微店组织申请表单,处理退款类型、收货状态、原因及金额范围的渠道差异,登记退货物流;客户退款依据接口返回的可操作标记筛选批量受理、驳回对象。
- 不记录:全部平台字段、原因枚举与状态码,不将分渠道表单写成通用规则引擎,不推定所有渠道均采用同一接口或金额校验;不新增资金分配算法、账务处理、后端权限或状态机设计,以及逐项个人独立建设和线上效果。
- 理由:渠道售后体现条件变化对表单的影响,客户退款体现批量操作的业务限制;用“客户退款”区分面向客户与面向采购商家的处理。具体渠道预览、状态变化时清理原因等留在上下文,不与绩效展示混成单纯功能清单。
- 售后表单与批量处理: 按淘宝、1688、微店的渠道差异组织售后申请表单,联动退款类型、收货状态、退款原因及金额范围,支持退货物流登记;客户退款按接口返回的可操作标记筛选批量受理、驳回对象。
仓储绩效与目标展示 · 编写规则
- 目的:补充后台的数据展示能力,说明统计维度切换及历史目标变化的处理。
- 记录:ECharts 展示员工对比与个人作业趋势,按日期、员工和作业环节筛选;依据历史目标调整记录划分查询区间,展示对应目标及生效日期。
- 不记录:全部图表配置、统计接口和日期边界算法,不将前端展示扩大为服务端统计计算、薪资结算或完整历史还原,不新增员工人数、作业量、效率收益及图表实测结论。
- 理由:统计独立成条以保持主题清晰,ECharts 交代工具,维度切换与目标分段交代具体处理。目标记录排序、区间裁剪、相邻同值合并和首条记录向查询起点延伸的边界留在上下文,不把目标线描述为逐日精确阶梯曲线。
- 仓储绩效与目标展示: 使用 ECharts 展示仓储各环节的员工对比与个人作业趋势,支持日期、员工和作业环节筛选;按历史目标调整记录划分查询区间,展示对应目标及生效日期。
登录依赖与发布检查 · 编写规则
- 目的:用登录阶段的依赖拆分和发布产物检查,说明具体的前端工程改造。
- 记录:拆分登录、会话与业务依赖,保留已有会话检查;React.lazy 与动态 import 按需加载业务模块;关闭发布 Source Map,构建时检查映射文件及引用残留,命中时终止构建。
- 不记录:完整依赖图、构建命令与静态资源路径,不将按需加载或关闭 Source Map 写成接口保密、后端权限控制、未登录无法下载业务代码;不新增包体或速度收益、全仓检查通过和线上验收结论。
- 理由:保留依赖拆分、加载方法、会话检查及制品检查的失败条件,说明具体工程改造;头像、WebSocket 和客服服务等加载对象及历史验证范围留在修改上下文。与第一条的工程概述各有分工,不展开主项目的完整构建部署流程。
- 登录依赖与发布检查: 拆分登录、会话与业务依赖,保留已有会话检查,通过 React.lazy 与动态 import 按需加载业务模块;关闭发布 Source Map,构建时检查映射文件及引用残留,检出即终止构建。
BBD 仓库小助手 PDA
面向仓库一线人员的 Android PDA 应用,以包裹、商品与货位条码驱动入库、出库、移位及异常处理,支持验货与打包的影像留档。
技术栈: Vue 3、uni-app、TypeScript、uni-ui、UTS、App-Plus / Native.js(Android)、Canvas、OSS。
- 广播扫码接入: 抽取扫码 Hook,通过 Native.js 接入 Android PDA 广播,在收货流程汇合输入框、相机与广播条码;随页面生命周期注册和注销监听,处理广播与键盘模拟的重复报码,并按广播可用状态管理输入焦点。
- 上架作业控制: 以单件状态机管理货位与包裹扫码,提交绑定当次货位快照;处理中及异常待处理时拦截新码,记录被拦截广播及原因,超时或断链时提示结果待确认;重试复用请求编号和货位快照,结合本机分片日志与会话计件支持异常追踪。
- 媒体采集上传: 封装图片、视频采集上传组件,复用于商品主图、详情图与 QC 照片,支持文件限制、限并发任务队列、上传进度、超时取消与失败重试,配合页面实现预览和删除。
- 拍照留档与恢复: 抽取入库、出库照片的方向及尺寸归一化与 Canvas 水印导出,接入 OSS 上传、凭证失效刷新及可恢复错误重传;入库照片登记结果未知时先查询核对,页面内保留失败任务供重试,未完成任务阻止业务提交,并清理生成的水印文件。
- 原生水印模块: 通过 UTS 桥接 Android Kotlin 与 iOS Swift,实现图片方向校正、二维码与图文水印合成、JPEG 质量调整及缩略图生成;以本地文件路径交互,支持任务取消、输出清理与分阶段耗时记录,并完成功能验证。
- 请求诊断与更新: 统一多环境请求、鉴权与网络超时重试,通过请求编号关联本机诊断并遮罩部分敏感字段;接入 WGT 版本检测、确认下载与安装,区分下次冷启动生效和必要更新后的重启流程。
新智慧 TMS 物流管理系统
面向跨境物流企业的管理系统,包含 Web 业务后台和通过 uni-app 容器承载的 PDA H5 页面。
技术栈: React、Umi、TypeScript、Ant Design、uni-app。
- 参与 TMS 业务页面、配置化表格及公共组件开发。
- 参与 PDA H5 与容器联调,配合处理容器通信、接口跨域、打印机及流水线设备调用和业务数据同步问题。
教育经历
模块规则
- 目的:清楚呈现教育背景。
- 记录:已确认的学校、专业、学历及起止时间。
- 不记录:未核实的日期、推定的学习形式或额外资质,以及无关课程清单。
- 理由:教育信息集中、简洁且可核对,无须重复技术能力和项目内容。
- 广东白云学院|软件工程|本科
- 深圳信息职业技术学院|软件技术|大专
关联阅读
- 简历修改上下文:当前简历的取舍依据、真实时间线、项目素材来源与待核实边界。
- 简历技能与项目对照:技术能力与项目案例的对应关系、确认范围和后续补充入口。
- 职业经历与 BBDbuy:从 2022 年开始的工作经历,以及借助 Codex 推进三端项目的实践。