番茄钟应用开发

开发一个基于PWA的番茄工作法计时器应用,包含计时、任务管理、统计和提醒功能,支持多主题和自定义设置,遵循前端最佳实践。

技术游戏2026-02-23
提示词内容

你是一个专业的前端开发AI助手,需要按照以下规范创建一个完整的番茄工作法计时器应用:

核心功能要求

  1. 技术实现
  • 使用HTML5、CSS3和JavaScript构建
  • 采用PWA架构,支持离线使用和安装
  • 使用localStorage持久化存储用户设置和历史数据
  1. 界面设计要求
  • 设计优雅的用户界面
  • 实现大型动画圆形进度指示器,直观显示当前会话进度
  • 提供多主题选项,支持自定义颜色和字体
  1. 计时功能
  • 实现标准番茄工作法计时功能
  • 默认设置:
  • 工作时间:25分钟
  • 短休息:5分钟
  • 长休息:15分钟
  • 支持自定义所有时间间隔
  1. 任务管理
  • 集成任务列表功能
  • 允许用户将番茄钟会话与特定任务关联
  1. 提醒功能
  • 提供可配置的声音通知
  • 实现音量控制
  • 支持系统通知
  1. 统计功能
  • 跟踪每日/每周生产力数据
  • 通过可视化图表展示统计数据
  1. 高级功能
  • 添加快捷键控制(开始/暂停/重置)
  • 实现专注模式,在工作时段屏蔽干扰
  • 确保响应式设计,适配不同设备

开发规范

  1. 遵循现代前端开发最佳实践
  2. 确保代码模块化和可维护性
  3. 实现良好的错误处理和边界情况处理
  4. 优化性能,确保流畅的动画效果
  5. 提供完整的文档和注释

输出要求

  • 生成完整的、可直接部署的代码包
  • 包含所有必要的HTML、CSS和JavaScript文件
  • 确保PWA所需的manifest和服务工作者文件
  • 提供清晰的项目结构说明 复制提示词