egc-dashboard-template — HTML 后台模板

SHA-256: f53e02ce3aac510ecf5a1641eaf38f951f79db2d60857bc584bcd11fdb2440f8

2026-10-15T10:07:20.942Z

# EGC Dashboard Template

A static, agent-friendly template for building an Employee Generated Content
leaderboard: team reach, top posts, race animation, trends, and per-poster
activity.

This is the public version of the Slite EGC dashboard.

## Quick Start

```bash
npm install
npm run build
open dist/index.html
```

By default the build uses `data.example.json`. To use your own data:

```bash
cp data.example.json data.json
# edit data.json or ask an agent to generate it from your source system
npm run build
```

The dashboard is static. You can host `dist/` anywhere.

## Auto Update

The repo includes an optional scheduled refresh path. Add
`scripts/fetch-data.mjs` so it prints schema-valid dashboard JSON to stdout, then
use `.github/workflows/refresh-dashboard.yml` to rebuild, validate, commit, and
deploy the dashboard on a schedule.

Start from:

```bash
cp scripts/fetch-data.example.mjs scripts/fetch-data.mjs
```

More detail: [docs/auto-update.md](docs/auto-update.md).

## Recreate With An Agent

Point your agent at this repository and say:

```txt
Build an EGC dashboard for our team.
Use AGENTS.md, inspect data.schema.json, create data.json from our LinkedIn or
social analytics export, run npm run build, and deploy dist/ to Cloudflare Pages.
```

The agent should only need to produce a `data.json` matching the schema. The
visual system and build step are already here.

## Data Sources

The included dashboard expects aggregated metrics by person and period:

- posts
- impressions / reach
- likes, comments, reposts
- top posts with public URLs and timestamps
- optional all-post `activity_posts` for accurate activity heatmaps
- follower counts

You can feed it from MagicPost, Shield, Taplio, a spreadsheet export, a warehouse
query, or a hand-built JSON file. The source does not matter as long as
`data.json` matches `data.schema.json`.

## Deploy To Cloudflare Pages

```bash
npm run build
npx wrangler pages deploy dist --project-name egc-dashboard
```

More detail: [docs/deploy-cloudflare-pages.md](docs/deploy-cloudflare-pages.md).

## Files

- `AGENTS.md` tells coding agents how to recreate the dashboard.
- `.github/workflows/refresh-dashboard.yml` is an optional scheduled refresh loop.
- `data.schema.json` is the public data contract.
- `data.example.json` is fake sample data.
- `scripts/fetch-data.example.mjs` shows the refresh-script contract.
- `src/template.html` is the visual dashboard.
- `scripts/build.mjs` embeds data into the template and writes `dist/`.
- `public/photos/` contains sample avatars copied into `dist/photos/`.

## Privacy

Do not commit tokens, private post analytics, private customer data, emails,
internal IDs, or raw employee exports you do not want public. For a public demo,
use anonymized data or data from posts that are already public.

## Built By Slite

Built by [Slite](https://slite.com) as a forkable template for teams that want
to turn social posting into a visible, playful team ritual.