用 AI
做一个数据看板。
让信息有层次,让常用操作更顺手。
需要验证内部工作流或管理界面的产品与开发人员。
第一版的边界
第一版使用明确标注的本地演示数据,不声称已接入真实业务数据;不实现多用户权限。
开工包生成器无需注册 · 本地生成
管理后台 / React + VitePROJECT-BRIEF.md
# 项目开工简报 ## 我要做什么 一个自由职业项目管理后台:展示进行中的项目、截止日期、任务状态和项目列表。 ## 项目起点 项目目录:my-app 技术栈:React + Vite。先检查当前目录与已有代码;已有项目不要重复初始化或覆盖。 ## 第一版范围 - 清楚划分导航和主工作区 - 展示可解释的汇总指标 - 提供可搜索、可筛选的记录列表 - 实现详情查看和状态修改 ## 暂时不做 第一版使用明确标注的本地演示数据,不声称已接入真实业务数据;不实现多用户权限。 ## 交付要求 - 先用简短文字说明实现方案和需要澄清的关键假设。 - 实现完整的核心操作,包含空状态、错误提示和手机布局。 - 安装依赖前核对官方文档与兼容性,按需要添加,不堆叠库。 - 不编造数据来源、客户评价或已实现的服务能力。 - 最后运行适合本次改动的检查,说明启动方式与尚未完成的部分。 ## 验收清单 - [ ] 所有示例数据明确标为演示 - [ ] 筛选与指标使用同一份数据 - [ ] 详情和编辑流程可以完整走通 - [ ] 窄屏表格可以滚动或改为列表
在你自己的终端依次运行官方文档
npm create vite@latest my-app -- --template react-ts cd my-app npm install npm run dev
先安装满足框架要求的 Node.js。已有项目请跳过初始化。
交付之前,实际走一遍
- 所有示例数据明确标为演示
- 筛选与指标使用同一份数据
- 详情和编辑流程可以完整走通
- 窄屏表格可以滚动或改为列表
需求留在当前浏览器;不会发送给模型或保存到服务器。
带着这份简报开工
先把上方示例改成自己的想法。复制简报给你正在使用的 AI 编程工具,要求它先检查项目、说明方案,再开始实现。
下载的 .md 文件包含需求简报、初始化命令与验收清单,它不是已经写好的应用源码。完成后逐项检查,比只看一张页面截图更可靠。
用之前,知道这几件事
- 先安装符合框架当前要求的 Node.js 和选定包管理器。
- 启动命令只用于创建新项目;已有项目不要重复初始化。
- 简报在本地按模板生成,不会调用模型或替你运行代码。
- 分享链接只包含方案选项,不包含你填写的需求。
想做什么?从一个场景开始。
先把第一版做小,再把一件事做好。