mcpField
H
happiness-dashboard

happiness-dashboard

github.com/rebyteai-template数据与数据库1750 次安装19 周前更新
代码仓库

关于 happiness-dashboard

基于 Evidence 的交互式幸福指数数据看板模板，使用 Markdown 编写 SQL 查询并生成可视化。面向需要基于 CSV 数据构建并生成静态站点的项目开发者，数据由嵌入式 DuckDB 处理。

主要功能

  1. 01在 Markdown 中编写 SQL 查询
  2. 02使用 Evidence 创建可视化
  3. 03嵌入式 DuckDB 处理数据
  4. 04从 CSV 文件加载年度与历史数据
  5. 05构建静态站点

适用场景

  1. 01展示当前年度幸福指数数据
  2. 02比较幸福指数的历史记录
  3. 03从 CSV 数据构建静态数据看板

安装

复制下面的命令，在终端中运行。

$npx skills add https://github.com/rebyteai-template/rebyte-skills --skill happiness-dashboard

安装后在 Claude Code 中输入/happiness-dashboard确认已加载。

详细介绍

幸福度仪表板

使用 Evidence 框架构建的交互式数据仪表板——在 Markdown 中编写 SQL 查询以创建可视化内容。

技术栈

  • 框架：Evidence
  • 数据库：DuckDB（嵌入式）
  • 前端：Svelte
  • 包管理器：pnpm
  • 输出：build 目录
  • 开发端口：3000

设置

1. 克隆模板
git clone --depth 1 https://github.com/Eng0AI/happiness-dashboard-template.git .

如果目录非空：

git clone --depth 1 https://github.com/Eng0AI/happiness-dashboard-template.git _temp_template
mv _temp_template/* _temp_template/.* . 2>/dev/null || true
rm -rf _temp_template
2. 移除 Git 历史记录（可选）
rm -rf .git
git init
3. 安装依赖项
pnpm install
4. 处理数据源
pnpm run sources

构建

pnpm run build

在 build/ 目录中生成静态网站。

部署

Vercel（推荐）
vercel pull --yes -t $VERCEL_TOKEN
vercel build --prod -t $VERCEL_TOKEN
vercel deploy --prebuilt --prod --yes -t $VERCEL_TOKEN

**重要提示：**请从项目根目录部署，而不是从 build/ 目录部署。

Netlify
netlify deploy --prod --dir=build

数据源

sources/happiness_score/ 中的 CSV 文件：

  • hs2024.csv - 当前年份的幸福度数据
  • hsArchive.csv - 历史幸福度数据

备注

  • 使用 pnpm（不要使用 npm）——.npmrc 中设置了 shamefully-hoist=true，以兼容 Evidence
  • 在本地构建——由于 DuckDB 编译耗时较长（40 分钟以上），Vercel/Netlify 构建可能会超时
  • 使用 CSV 文件，无需设置数据库
  • 切勿在 VM 环境中运行 pnpm run dev

评论

支持 Markdown