全职 · Appnovation
OCL 忠诚度网页应用
移动优先的忠诚度计划平台，具备任务、促销、优惠和电子印章功能，采用 Ionic React 组件和 AEM 集成。
- 角色
- 前端架构师
- 类型
- 在 Appnovation 全职工作期间开发
- 时间
- 2026.01
在 2 周的密集冲刺中从零开始架构并构建完整的忠诚度计划网页应用。开发包含 6 个主要部分的主页、任务和促销系统、带有 CSS 模块的可重用组件库以及全面的服务层架构。实现下拉刷新、按压动画和磨砂玻璃设计系统。构建从 AEM 到轻量级 API 方法的迁移路径。
我做了什么
- 01构建完整的主页架构，包含活动聚焦、快速访问、任务预览、促销、限时抢购、专属优惠和电子印章部分
- 02开发全面的组件库（53 个 CSS 模块），包括 CollapsibleSection、FilterModal、SortModal 和 NavBar 组件
- 03实现 AEM 无头 CMS 集成，具备服务层抽象和迁移到更简单 API 方法的路径
- 04创建移动优先响应式系统，具备下拉刷新、10% 黑色按压叠加和缩小动画
- 05建立设计系统，包含玻璃态效果、橙红色品牌色和基于内容的模态断点
- 06修复所有 27 个 ESLint 错误，提高整个代码库的类型安全性和代码质量
值得一讲的故事
2 周冲刺中完成 26 次提交，添加 9,264 行代码
具备筛选/排序功能的完整任务和促销系统
包含 53 个 CSS 模块文件的可重用组件库
服务层架构，支持轻松迁移内容源（AEM → API）
生产就绪，具备 TypeScript 严格模式和全面的错误处理
数字
- 添加 9,264 行
- 26 次提交
- 53 个 CSS 模块
- 2 周冲刺
技术栈
- React 19
- TypeScript
- Ionic React 8
- Vite 5
- Capacitor 8
- CSS 模块
- Adobe Experience Manager
- Axios
- React Router 5
- AWS S3