type
status
date
slug
summary
tags
category
icon
password
标签
是否汉化
📌
看得清是知,做得到是行 → 知行合一
✍🏻
爱跑步小伙伴的福音,个人主页构建,喜欢折腾的小伙伴看过来👀

个人跑步主页 ⬇️


感谢大佬 @yihong0618
以下是基本的搭建步骤,以keep数据为例,其他平台数据及配置详情参见

搭建步骤


1. Fork以下项目

running_page
yihong0618Updated Jan 12, 2024
notion image

2. 环境配置


  • 将自己github下的项目clone到本地
  • 安装及测试 (node >= 16 python >= 3.8)

3. 个性化设置


 
在仓库目录下找到 src/static/site-metadata.ts,找到以下内容并修改成你自己想要的。
 

4. 下载数据到本地


keep用户占比大,以keep举例,下载您的 Keep 数据到本地,别忘了在 total 页面生成可视化 SVG
  • Keep
  1. 获取 Keep 数据
    1. 示例
  1. 路线偏移修正
    1. 增加了 keep 可以导出 gpx 功能(因 keep 的原因,距离和速度会有一定缺失), 执行如下命令,导出的 gpx 会加入到 GPX_OUT 中,方便上传到其它软件
 
  • Total Data Analysis
  1. 生成数据展示 默认是10公里 可自行修改
    1. special-distance 10 --special-distance2 20
      筛选10km 其中20km以上黄色显示
      notion image
      --min-distance 10.0 --special-distance 20 --special-distance2 40
      默认10km蓝色,20km黄色,40km红色
      notion image

5. 提交代码至自己github


6. server部署(两种部署方式,任选其一)


使用 Vercel 部署

  1. vercel 连接你的 GitHub repo
notion image
  1. import repo
notion image
  1. 等待部署完毕
  1. 访问
 

部署到 GitHub Pages

  1. 进入仓库的 "Settings -> GitHub Pages -> Source",选择 "GitHub Actions"
  1. 进入仓库的 "Actions -> Workflows -> All Workflows",选择左侧面板的 "Run Data Sync",然后点击 "Run workflow"
  • "Run Data Sync" 将更新数据,然后触发 "Publish GitHub Pages" 工作流
  • 确认工作流运行没有错误
  1. 打开网站检查结果
  • 如果网站没有反映最新数据,请使用“F5”刷新页面
  • 某些浏览器 (比如 Chrome) 可能缓存网页不刷新,您需要使用 Ctrl+F5 (Windows) 或 Shift+Cmd+r (Mac) 强制清除缓存并重新加载页面
  1. 为 GitHub Actions 添加代码提交权限,访问仓库的 Settings > Actions > General页面,找到 Workflow permissions 的设置项,将选项配置为 Read and write permissions,支持 CI 将运动数据更新后提交到仓库中。
  1. 如果想把你的 running_page 部署在 xxx.github.io 而不是 xxx.github.io/run_page,需要做三点
  • 修改你的 fork 的 running_page 仓库改名为 xxx.github.io, xxx 是你 github 的 username
  • 修改 gh-pages.yml 中的 Build 模块,删除 ${{ github.event.repository.name }} 改为run: PATH_PREFIX=/ pnpm build 即可
  • src/static/site-metadata.ts 中 siteUrl: '' 即可

7. 定时任务 GitHub Actions


  • 修改 GitHub Actions Token
    • 文件:.github/workflows/run_data_sync.yml
      将RUN_TYPE 改为 keep
      notion image
  • 在 repo Settings > Secrets 中增加你的 secret
    • KEEP_MOBILE 手机号
      KEEP_PASSWORD 密码
notion image
notion image
 
  • 然后手动执行 action
notion image
 

8. Github Cache


  • 把数据文件放在 GitHub Cache 中
    • run_data_sync.yml 中的 SAVE_DATA_IN_GITHUB_CACHE 设置为 true 时,可以把脚本抓取和中间产生的数据文件放到 GitHub Actions Cache 中。这样可以让你的 GitHub commit 历史和目录保持干净。
      如果你用 GitHub Pages 部署建议把这个值设置成 true
       

      🎒
      离开乏味的皮囊,自由的灵魂在路上
      • Name: Alan Hsu
      • Tag: 随感、技术、经验、旅行、推荐、生活、音乐、电影 etc.
      • Email:xulanzhong521gmail.com
      • WeChat: Alan_Hsu_521
      notion image
      notion image
       
       
       
Mac查看Python安装路径和版本2024_周报 #02
  • Twikoo
  • Cusdis