README-EN.md

Create a personal running home page

简体中文 | English

Runner's Page Show

Runner	page	App
shaonianche	https://run.duangfei.org	Nike
yihong0618	https://yihong.run/running	Nike
superleeyom	https://running.leeyom.top	Keep
geekplux	https://activities.geekplux.com	Nike
guanlan	https://grun.vercel.app	Strava
tuzimoe	https://run.tuzi.moe	Nike
ben_29	https://running.ben29.xyz	Strava

Features

1. GitHub Actions manages automatic synchronization of runs and generation of new pages.
2. Gatsby-generated static pages, fast
3. Support for Vercel (recommended) automated deployment
4. React Hooks
5. Mapbox for map display
6. Nike and Runtastic (Adidas Run) automatically backup gpx data for easy backup and uploading to other software.

Support

• Strava
• Nike Run Club
• Runtastic (Adidas Run)

Download

Clone or fork the repo.

git clone https://github.com/yihong0618/running_page.git

Installation and testing

pip3 install -r requirements.txt
yarn install
yarn develop

Open your browser and visit http://localhost:8000/

Local sync data

Delete my test data

rm scripts/data.db GPX_OUT/* activities/*

OR

rm scripts/data.db
rm GPX_OUT/*
rm activities/*

Download your Garmin/Garmin-CN/Runtastic(Adidas Run)/Nike Run Club/Strava data

Garmin

python3(python) scripts/garmin_sync.py ${your email} ${your password}

example：

python3(python) scripts/garmin_sync.py example@gmail.com example

Garmin-CN(China)

python3(python) scripts/garmin_sync.py ${your email} ${your password} --is-cn

example：

python3(python) scripts/garmin_sync.py example@gmail.com example --is-cn

Runtastic(Adidas Run)

python3(python) scripts/runtastic_sync.py ${your email} ${your password}

example：

python3(python) scripts/runtastic_sync.py example@gmail.com example

Nike Run Club

Get Nike's refresh_token

1. Login Nike website

2. In Develop -> Application-> Storage -> https:unite.nike.com look for refresh_token

   

3. Execute in the root directory:

   python3(python) scripts/nike_sync.py ${nike refresh_token}

   example：

   python3(python) scripts/nike_sync.py eyJhbGciThiMTItNGIw******

   

Runtastic(Adidas Run)/Nike Run Club Data Analysis

• Generate SVG data display

• Display of results：Click to view、Click to view

  python scripts/gen_svg.py --from-db --title "${{ env.TITLE }}" --type github --athlete "${{ env.ATHLETE }}" --special-distance 10 --special-distance2 20 --special-color yellow --special-color2 red --output assets/github.svg --use-localtime --min-distance 0.5
  

  python scripts/gen_svg.py --from-db --title "${{ env.TITLE_GRID }}" --type grid --athlete "${{ env.ATHLETE }}"  --output assets/grid.svg --min-distance 10.0 --special-color yellow --special-color2 red --special-distance 20 --special-distance2 40 --use-localtime
  

  For more display effects, see:
  https://github.com/flopp/GpxTrackPoster

Strava

1. Sign in/Sign up Strava account

2. Open after successful Signin Strava Developers -> Create & Manage Your App

3. Create My API Application
   Enter the following information： Created successfully：

4. Use the link below to request all permissions
   Replace ${your_id} in the link with My API Application Client ID

   https://www.strava.com/oauth/authorize?client_id=${your_id}&response_type=code&redirect_uri=http://localhost/exchange_token&approval_prompt=force&scope=read_all,profile:read_all,activity:read_all,profile:write,activity:write
   

   

5. Get the code value in the link
   example：

   http://localhost/exchange_token?state=&code=1dab37edd9970971fb502c9efdd087f4f3471e6e&scope=read,activity:write,activity:read_all,profile:write,profile:read_all,read_all
   

   code value：

   1dab37edd9970971fb502c9efdd087f4f3471e6
   

   

6. Use Client_id、Client_secret、Code get refresch_token

   Execute in Terminal/iTerm:

   curl -X POST https://www.strava.com/oauth/token \
   -F client_id=${Your Client ID} \
   -F client_secret=${Your Client Secret} \
   -F code=${Your Code} \
   -F grant_type=authorization_code
   

   example：

   curl -X POST https://www.strava.com/oauth/token \
   -F client_id=12345 \
   -F client_secret=b21******d0bfb377998ed1ac3b0 \
   -F code=d09******b58abface48003 \
   -F grant_type=authorization_code
   

   

7. Sync Strava data

   python3(python) scripts/strava_sync.py ${client_id} ${client_secret} ${refresch_token}

   References https://developers.strava.com/docs/getting-started
   https://github.com/barrald/strava-uploader
   https://github.com/strava/go.strava

server(recommendation vercel)

1. vercel connects to your GitHub repo.
2. import repo
3. Awaiting completion of deployment
4. Visits

GitHub Actions

Actions source code The following steps need to be taken

1. change to your app type and info Add your secret in repo Settings > Secrets (add only the ones you need). My secret is as follows
2. add your GitHub secret and have the same name as the GitHub secret in your project.

My display

TODO

• Complete this document.
• Support Garmin, Garmin China
• Support the Joy Runner
• support for nike+strava, runtastic+strava
• Support English
• Refine the code
• add new features

Contribution

Before submitting PR:

• Format Python code with Black

Special thanks

@flopp @shaonianche