Data Storage
CODEBLOCK0
Create on first use: INLINECODE0
Scope
This skill:
- - ✅ Generates static HTML dashboards
- ✅ Creates fetch scripts user can run
- ✅ Stores dashboards in ~/dashboard/
User-driven model:
- - User specifies data sources
- User provides API credentials via environment
- User runs fetch scripts (cron or manual)
- Skill generates HTML and fetch scripts
This skill does NOT:
- - ❌ Access credentials without user providing them
- ❌ Run automated fetches (user's cron runs scripts)
- ❌ Scrape services without user consent
Quick Reference
| Topic | File |
|---|
| Data source patterns | INLINECODE1 |
| Visual design rules |
design.md |
| Widget templates |
widgets.md |
Core Rules
1. User Provides Data
When creating a dashboard:
CODEBLOCK1
2. Architecture
CODEBLOCK2
Agent generates scripts. User runs them.
3. Fetch Script Template
CODEBLOCK3
4. Visual QA (Before Delivery)
- - Open in browser, take screenshot
- Check: no overlap, readable fonts (≥14px), good contrast
- If issues → fix → repeat
- Only deliver after visual validation
5. Design Defaults
| Element | Value |
|---|
| Background | INLINECODE4 (dark) / #f8fafc (light) |
| Text |
#e2e8f0 (dark) /
#1e293b (light) |
| Spacing | 16px, 24px, 32px |
| Corners | 8px |
| KPI | 48-72px number, 14px label |
6. Security
- - Credentials via env vars, never in files
- Dashboards on
127.0.0.1 by default - No PII in displayed data
- User adds auth if exposing to network
数据存储
~/dashboard/
├── registry.json # 仪表盘索引
├── {name}/
│ ├── config.json # 布局、组件
│ ├── data.json # 当前数据
│ └── index.html # 仪表盘页面
首次使用时创建：mkdir -p ~/dashboard
适用范围
本技能：
- - ✅ 生成静态HTML仪表盘
- ✅ 创建用户可运行的获取脚本
- ✅ 将仪表盘存储在 ~/dashboard/ 目录下
用户驱动模型：
- - 用户指定数据源
- 用户通过环境变量提供API凭证
- 用户运行获取脚本（定时任务或手动）
- 技能生成HTML和获取脚本
本技能不执行：
- - ❌ 在用户未提供的情况下访问凭证
- ❌ 运行自动获取（用户的定时任务运行脚本）
- ❌ 未经用户同意抓取服务
快速参考
| 主题 | 文件 |
|---|
| 数据源模式 | sources.md |
| 视觉设计规则 |
design.md |
| 组件模板 | widgets.md |
核心规则
1. 用户提供数据
创建仪表盘时：
用户：为我的Stripe收入创建仪表盘
助手：我将创建一个获取脚本。请在环境中设置
STRIPEAPIKEY，然后运行脚本。
→ 生成：~/dashboard/stripe/fetch.sh
→ 用户添加到定时任务：/15 * ~/dashboard/stripe/fetch.sh
2. 架构
[用户定时任务] → [fetch.sh] → [data.json] → [index.html]
↓
使用环境变量中的 $API_KEY
助手生成脚本。用户运行它们。
3. 获取脚本模板
bash
#!/bin/bash
需要：环境中设置 STRIPEAPIKEY
curl -s -u $STRIPE
APIKEY: \
https://api.stripe.com/v1/balance \
| jq . > ~/dashboard/stripe/data.json
4. 视觉质量检查（交付前）
- - 在浏览器中打开，截图
- 检查：无重叠、字体可读（≥14px）、对比度良好
- 如有问题 → 修复 → 重复检查
- 仅通过视觉验证后交付
5. 设计默认值
| 元素 | 值 |
|---|
| 背景 | #0f172a（深色）/ #f8fafc（浅色） |
| 文本 |
#e2e8f0（深色）/ #1e293b（浅色） |
| 间距 | 16px, 24px, 32px |
| 圆角 | 8px |
| 关键指标 | 数字48-72px，标签14px |
6. 安全性
- - 凭证通过环境变量传递，绝不写入文件
- 仪表盘默认绑定 127.0.0.1
- 显示数据中不包含个人身份信息
- 如需暴露到网络，用户自行添加认证
