SuperAPI AI 工具集

building-data-apps

前端与建站

查看项目

更新于 10-15 21:54

技能介绍

用途:构建高质量数据仪表盘与交互式报告,实施前必须先选定框架。

框架选择:Streamlit 适合数据科学家/Python 用户、依赖 Pandas/NumPy 的本地数据处理、单文件脚本部署、标准布局快速搭建;React + Vite 适合 Web 开发者/全栈团队、高 UI 与交互需求(拖拽、交互地图)、独立前端加后端 API 部署、深度定制。优先沿用项目已有技术栈(如存在 package.json 的 React 依赖则用 React,已有 Streamlit 文件则用 Streamlit);生产级应用默认 React + Vite,用户明确提到 Python 仪表盘或单脚本部署时默认 Streamlit。

实施:需先向用户提出包含框架选择及理由的计划。共享设计规范见 references/shared_design_system.md,视觉为极简、zinc 配色、卡片布局,字体 DM Sans 与 JetBrains Mono。Streamlit 参考 references/streamlit_framework.md 并遵循其中的新仪表盘清单;React + Vite 参考 references/react_framework.md 的 Tailwind 与 ECharts 配置。

可选 AI 聊天:用户未明确要求时应主动询问是否加入 Gemini 驱动的自然语言查询界面;加入属于重大变更,必须获得用户对更新后计划的明确批准,不可默认同意。需阅读 references/chat_integration.md,确认已启用 Gemini Data Analytics API 且 BigQuery 中有数据,并参考 examples/react_chat_panel.jsx 与 examples/fastapi_chat.py 或 examples/express_chat.ts。

验收:如有浏览器测试能力(browser_subagent、Puppeteer、Playwright 等)须在完成前可视化验证前端。检查项包括 CSS 悬停过渡、日期格式(如 MMM dd, yyyy)、z-index 层级(relative z-30)、加载/禁用状态、响应式布局、API 调用与错误处理、暗色模式、可视化渲染与交互、整体观感。

限制:资料未提供具体安装命令、收费与价格信息。