How zelvarys/github-analytics works
GitHub Analytics serves customizable SVG profile cards and also offers a web configurator for previewing and copying embed markup. The documented flow is username and card options → GitHub data retrieval and metric derivation → themed SVG generation → image response for a README embed. The sampled API, data, theme, and rendering modules support those connections; the page excerpt confirms a browser preview workflow, but omits enough code to establish its exact request wiring.
Main entry points: route.ts SVG endpoint · page.tsx Card configurator · github.ts Stats retrieval · generator.ts Card composition
Components 12
Web experience
- Card configurator
src/app/page.tsx - App shell
src/app/layout.tsx
Card API
- SVG endpoint
src/app/api/route.ts
GitHub data
- Stats retrieval
src/lib/github.ts - Stats model
src/types/index.ts
SVG rendering
- Theme selection
src/lib/themes.ts - Card composition
src/lib/generator.ts - SVG utilities
src/lib/svg-utils.ts
Other components
- Profile author
- Configurator user
- GitHub GraphQL
- Profile README
Connections 13
- Configurator user → Card configurator: configures
- Profile author → SVG endpoint: requests card
- Card configurator → SVG endpoint: previews card
- SVG endpoint → Stats retrieval: fetches stats
- Stats retrieval → GitHub GraphQL: queries profile
- Stats retrieval → Stats model: returns stats
- SVG endpoint → Theme selection: selects theme
- SVG endpoint → Card composition: generates SVG
- Card composition → SVG utilities: renders assets
- Card composition → Stats model: uses stats model
- Theme selection → Stats model: uses color model
- SVG endpoint → Profile README: serves SVG for embed
- Card configurator → Profile README: offers embed markup