GitHub Trends 实战指南:用个人提交数据打造可嵌入 GitHub Profile 的 LOC 统计卡片
后端前端数据可视化【免费下载链接】github-trends Level up your GitHub profile readme with customizable cards including LOC statistics!项目地址https://gitcode.com/gh_mirrors/gi/github-trends点击查看免费下载GitHub Trends 是一个基于个人 commit 数据生成代码贡献统计卡片的开源项目它不依赖仓库的 Star 数或公共仓库整体指标而是深入解析你每一笔提交commit的增删行数按语言、按仓库、按时间段聚合出线代码量Lines of CodeLOC统计并输出可动态嵌入 GitHub Profile README 的 SVG 图片。读完本文你将掌握 GitHub Trends 的完整使用流程注册认证公开/私有两种工作流、拼接 Languages 卡片与 Repositories 卡片的 API 端点与全部定制参数、切换 6 种内置主题以及在本地运行其官方脚本直接计算统计结果而不泄露访问令牌。本文核心文档为仓库根目录的 README.md并融合了 docs/API.md、docs/FAQ.md、docs/THEME.md 的说明同时对照后端源码如 backend/src/routers/users/svg.py、backend/src/processing/user/commits.py印证参数的实际作用与底层计算逻辑。项目是什么深入 GitHub API 的个人贡献指标根据 README 的定位GitHub Trends 会dives deep into the GitHub API深入挖掘 GitHub API为你带来关于代码贡献的指标。它可以按语言、仓库和时间三个维度统计你写下的代码行数将统计结果渲染成动态图片SVG方便嵌入 GitHub Profile 展示给全世界。项目提供两类核心卡片详见 docs/API.md卡片说明Languages Card语言卡片查看指定时间区间内你的 Top 语言基于你对个人仓库与开源仓库的所有提交Repositories Card仓库卡片查看指定时间段内你贡献代码行数最多的仓库同样包含个人仓库与开源仓库两者均默认展示 Top 5 项语言卡片还会追加一个 Other 聚合条目顶部子标题会显示统计时间范围、LOC 口径以及被排除的提交数。为什么与众不同基于 commit 而非仓库的统计口径README 明确解释了 GitHub Trends 与其他同类项目的关键差异很多同类项目只统计你的公开仓库整体指标而 GitHub Trends 基于你个人的每一次 commit 来计算。这意味着如果你为开源项目提交代码这些贡献会被准确计入你自己的名下如果你的仓库有协作者提交代码GitHub Trends 也能区分出你本人写的那部分而不是把整仓库的代码都算作你的产出。正是通过这种口径GitHub Trends 成为较早支持按语言、按仓库展示个人 LOC 统计的项目之一并且配套提供了更易用的 Web 界面用于定制卡片。从源码看这一能力由后端多层级聚合管道支撑src/aggregation/layer0backend/src/aggregation/layer0负责从 GitHub GraphQL/REST 拉取原始提交数据src/aggregation/layer1、layer2负责用户校验与组装最终由 backend/src/processing/user/commits.py 中的get_top_languages/get_top_repos聚合成卡片所需的数据结构。快速开始30 秒把卡片放进你的 Profile按照 README 的 Quickstart只需两步第一步注册账号访问https://api.githubtrends.io/auth/signup/public用 GitHub 账号授权创建 GitHub Trends 账号后面会详解公开/私有两种工作流的区别。第二步粘贴 Markdown将下面这段 Markdown 粘贴到你的 GitHub Profile README或任意 Markdown 内容中把avgupta456替换成你自己的用户名[](https://githubtrends.io)刷新页面你就能看到自己的语言统计卡片。默认显示最近 1 个月、仅公开贡献、LOC Added净增行数的统计。两种工作流Website 与 APIREADME 将使用方式分为两条路径Website Workflow网页工作流Alpha访问githubtrends.io注册账号并开始使用项目还提供了githubtrends.io/demo演示页供你注册前直观感受卡片效果。前端工程位于 frontend 目录包含 Home 定制页、Demo 页、Wrapped 页等frontend/src/pages。API WorkflowAPI 工作流Alpha如果你希望绕过网页、直接与后端 API 交互来创建和定制卡片请参阅 docs/API.md —— 这是本文后续章节的主要内容。两种工作流共用同一套卡片渲染服务API 工作流把可定制性完全暴露在 URL 查询参数上。认证机制公开与私有两种 OAuth 工作流无论使用哪种工作流创建卡片前都需要先注册 GitHub Trends 账号详见 docs/API.md 的 Authentication 章节。账号的作用是将代表你发往 GitHub API 的查询与你的 GitHub API 配额绑定。文档承诺在几乎所有场景下消耗不超过你配额的 5%。注册只需一次之后的所有请求都会使用存储的 access token。两种授权级别如下工作流权限覆盖范围注册地址Public Workflow公开信息的只读权限仅能分析你的公开贡献与公开仓库https://api.githubtrends.io/auth/signup/publicPrivate Workflow公开与私有信息的读写权限能分析你的完整贡献历史含私有仓库https://api.githubtrends.io/auth/signup/private访问对应地址后GitHub 会提示你授权随后顺利的话跳转到成功页面。两点进阶说明来自 docs/API.md升级如果之前只完成了公开工作流认证可以直接访问私有工作流的链接来升级权限无需另建账号注销想删除账号时去你的 GitHub Settings 里撤销授予 GitHub Trends 的 access token 即可后端也提供auth/delete/{user_id}与auth/redirect/delete/{user_id}路由用于删除本地用户数据见 backend/src/routers/auth/standalone.py。关于私有权限的边界问题为什么私有工作流申请了读写权限但仅使用读能力详见本文末尾的 FAQ 章节。Languages Card语言统计卡片认证完成后访问如下端点即可获取语言卡片docs/API.mdhttps://api.githubtrends.io/user/svg/{user_id}/langs卡片会展示你的 Top 5 语言基于对个人与开源仓库所有提交的统计。由于内部采用近似计算LOC 数值会四舍五入到最接近的 100 行。定制参数参数说明默认值time_range统计时间范围合法值one_month、three_months、six_months、one_year、all_timeone_monthinclude_private是否包含私有贡献需要私有工作流falsecompact是否使用紧凑布局强制显示百分比而非 LOCfalseuse_percent仅在compactfalse时有效决定显示 LOC默认还是百分比falseloc_metricLOC 口径added净增行数或changed增删总行数addedtheme卡片主题可选值见 docs/THEME.mdclassic参数以?开头、分隔依次追加到端点后例如https://api.githubtrends.io/user/svg/avgupta456/langs?time_rangethree_monthsinclude_privatetruecompacttrue参数背后的源码逻辑time_range映射后端在use_time_rangebackend/src/utils/utils.py中把每个取值映射为具体天数——one_month→30 天、three_months→90 天、six_months→180 天、one_year→365 天、all_time→3650 天并生成如Past 1 Year、All Time的展示文案显示在卡片子标题中。loc_metric计算口径loc_metric_funcbackend/src/processing/user/commits.py实现为changed时返回additions deletions增删总行数否则返回additions - deletions净增行数即 README 所称 lines written。include_private数据源切换为true时读取data.contribs.total_stats.languages含私有否则读取data.contribs.public_stats.languages。排序与 Top 5按 LOC 降序排序后取前 4 名其余语言合并进 Other 聚合条最终列表包含 Total、前 4 名与 Other。只有占比超过 1% 的条目才会被渲染。卡片渲染get_top_langs_svgbackend/src/render/top_langs.py使用svgwrite绘制紧凑布局compacttrue下卡片尺寸为 300×175普通布局为 300×285若数据不足会渲染get_no_data_svg的占位卡片。子标题信息卡片子标题会依次追加 LOC 口径LOC Added/LOC Changed、统计是否完整不完整时提示Incomplete (refresh to update)、以及被排除的提交数超过 50 时提示N commits excluded。Repositories Card仓库统计卡片认证完成后访问如下端点获取仓库卡片docs/API.mdhttps://api.githubtrends.io/user/svg/{user_id}/repos卡片展示你在给定时间段内贡献代码行数最多的仓库含个人与开源仓库。定制参数参数说明默认值time_range统计时间范围取值同 Languages 卡片one_monthinclude_private是否包含私有贡献需要私有工作流falsegroup分组策略none默认不分组、other其余仓库聚合为 Other、private强制私有仓库被聚合noneuse_percent仅在compactfalse时有效显示 LOC默认还是百分比falseloc_metricLOC 口径added或changedaddedtheme卡片主题可选值见 docs/THEME.mdclassic同样以?开头、分隔追加参数例如https://api.githubtrends.io/user/svg/avgupta456/repos?time_rangeone_yearinclude_privatetruegroupprivateloc_metricchangedthemedark参数背后的源码逻辑仓库聚合get_top_reposbackend/src/processing/user/commits.py遍历data.contribs.repo_stats先按include_private过滤私有仓库对每个仓库先粗算 LOC各语言 LOC 之和再剔除占比不足该仓库 5% 的语言后精算最终按 LOC 降序保留。展示条数bars 4源码中标注为 TODO后续可能开放配置即最多展示 4 个仓库条目。group三种策略backend/src/processing/user/commits.pynone仓库数量 ≤4 时直接全部展示否则也只取前 4other前 3 名独立展示其余仓库按语言合并进other/repos聚合条private先尽力让公开仓库占据展示位不足 4 个时用私有仓库补位多余的公开仓库与全部私有仓库合并进聚合条。卡片渲染get_top_repos_svgbackend/src/render/top_repos.py按仓库内各语言的占比绘制分色条形并在底部生成语言图例。主题定制6 种内置主题所有卡片Languages 与 Repositories均支持theme参数可用主题如下完整对照见 docs/THEME.md主题名风格classic经典配色默认dark深色主题bright_lights明亮霓虹风rosettes玫瑰红系ferns蕨类绿系synthwaves合成波Synthwave赛博风用法示例https://api.githubtrends.io/user/svg/avgupta456/langs?themesynthwaves主题在渲染层通过模板函数get_template(..., themetheme)作用于卡片的背景、文字与条形配色backend/src/render/template.py前端 Wrapped 组件同样复用主题体系frontend/src/components/Wrapped/Templates/theme.js。本地运行官方脚本不交出 token 也能看统计如果你不想把 access token 交给 GitHub Trends详见 FAQ官方提供了完全本地的运行方案docs/FAQ.md克隆本仓库进入backend目录backend安装依赖pip install -r requirements.txt依赖清单见 backend/requirements.txt运行本地脚本python ./scripts/local.py --user_idUSER_ID --access_tokenACCESS_TOKEN --start_date2023-01-01 --end_date2023-01-31 --output_dirOUTPUT_DIR脚本会把原始数据与加工后的 JSON写入你指定的输出目录。对照 backend/scripts/local.py 的parse_args全部可用参数如下参数必填默认值说明--user_id是-GitHub 用户 ID--access_token是-GitHub access token--start_date否2023-01-01起始日期YYYY-MM-DD格式--end_date否2023-01-31结束日期YYYY-MM-DD格式--timezone否America/New_York时区--output_dir否./输出目录脚本的实际输出为 4 个文件main函数backend/scripts/local.pyraw.jsonget_user_data拉取并聚合后的原始数据UserPackage模型JSON 格式化输出langs.json调用get_top_languages(raw_output, loc_metricchanged, include_privateTrue)得到的语言统计repos.json调用get_top_repos(raw_output, loc_metricchanged, include_privateTrue, groupnone)得到的仓库统计wrapped.json调用get_wrapped_data(raw_output, 2023)生成的年度 Wrapped 数据对应项目主页宣传的 GitHub Wrapped 功能。注意脚本内部固定使用loc_metricchanged、include_privateTrue因此在本地运行时你的 token 需要具备读取私有贡献的权限才能得到与私有工作流一致的结果。常见问题FAQ速览以下内容整理自 docs/FAQ.mdQ1GitHub Trends 能访问我的私有代码贡献吗公开工作流签发的 token 仅具有公开信息的只读权限无法查看或编辑任何私有贡献。若需分析私有贡献请使用私有工作流。需要说明的是由于 GitHub 平台本身不提供只读私有访问的 OAuth 粒度FAQ 引用了 2015 年以来的相关 issue私有工作流的 token 在权限声明上包含读写能力但 GitHub Trends 实际只使用其读权限。若你对此安全边界有顾虑请改用公开工作流。Q2如何让两张卡片并排显示在 Markdown 中使用 HTML技巧源自 github-readme-stats 项目a hrefhttps://githubtrends.io img aligncenter srchttps://api.githubtrends.io/user/svg/avgupta456/langs / /a a hrefhttps://githubtrends.io img aligncenter srchttps://api.githubtrends.io/user/svg/avgupta456/repos / /aaligncenter会让两张卡片水平对齐排列在 Profile 的同一行。Q3如何不交出 token 查看统计即上一节所述的本地脚本方案克隆仓库后通过python ./scripts/local.py ...在本地完成拉取与计算。Q4遇到 bug 或想贡献代码项目鼓励通过 GitHub 的 issue 和 pull request 流程参与欢迎讨论任何改进建议。局限与注意事项LOC 为近似值内部对 commit 的增删行数做了截断处理见 backend/src/constants.py 中CUTOFF 1000——单文件增删超过 1000 或合计超过 2000 行的 commit 会被忽略 LOCFILE_CUTOFF 1000控制文件级统计阈值因此文档明确 LOC 会四舍五入到 100 行忽略部分语言BLACKLIST [Jupyter Notebook, HTML]两种语言会被排除在统计之外公开访问限制从 backend/src/aggregation/layer2/auth.py 可以看出未认证的公开请求需要校验用户存在且对项目仓库点过 Star或已在数据库注册这是当前服务的访问控制策略本地脚本不受此限制数据缓存与刷新SVG 端点首次请求可能返回 Loading 占位卡并在后台任务中完成数据拉取见 backend/src/routers/users/svg.py 的run_in_background逻辑子标题显示Incomplete (refresh to update)时刷新页面即可更新。结语GitHub Trends 的核心价值在于以个人 commit 论英雄无论代码贡献给开源社区还是私有项目它都能按语言与仓库准确归因到你名下并以高度可定制、可嵌入的 SVG 卡片形式沉淀进你的 GitHub Profile。结合 README.md、docs/API.md、docs/FAQ.md、docs/THEME.md 四份文档以及backend/src/processing/user/commits.py、backend/src/routers/users/svg.py等源码你可以完整掌握从注册认证、端点拼接、参数定制、主题切换到本地脱机计算的整条使用链路。后续若需深入源码可从 backend/src数据层、聚合层、渲染层与 frontend/src网页定制界面继续探索。赞分享后端前端数据可视化【免费下载链接】github-trends Level up your GitHub profile readme with customizable cards including LOC statistics!项目地址https://gitcode.com/gh_mirrors/gi/github-trends点击查看免费下载相关推荐GitHub Trends打造个性化GitHub个人资料卡片的终极指南GitHub Trends打造个性化GitHub个人资料卡片的终极指南 GitHub Trends是一个革命性的开源项目专门为开发者提供深度GitHub贡献后端前端数据可视化打造专属GitHub个人主页Awesome GitHub Profile Readme终极指南打造专属GitHub个人主页Awesome GitHub Profile Readme终极指南 想要让你的GitHub个人主页在众多开发者中脱颖而出吗文档技术博客GDMaim与静态类型为什么静态类型对GDScript混淆如此重要GDMaim与静态类型为什么静态类型对GDScript混淆如此重要 GDMaim是一款专为Godot Engine设计的GDScript混淆插件它通过重命名上一篇Hypothesis项目API设计风格指南下一篇FrankenPHP技术解析基于Go构建的现代化PHP应用服务器创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考