前言
之前逛
github
,发现有人把github推送做成了贪吃蛇
, 研究下怎么实现的 。
我们可以借助工具把github
推送生成贪吃蛇,然后放到个人主页,可以显得更完(z)美(b)。
效果
- 原始图
- 个人github效果参考
- 贪吃蛇效果 ![TOG]
工具- snk
- snk-github地址
- 官方demo - 输入自己
github
账号可以测试效果
实现
1、github新建一个仓库 gihubSNK
2、仓库内配置Actions
- 进入仓库点击
Actions
- 点击
New workflow
- 点击
set up a workflow yourself
- 随便命名
xxx.yml
- 一下代码copy进去, 注意修改
github_user_name
name: generate animation SNK
on:
schedule:
- cron: "0 */6 * * *" # every 6 hours
workflow_dispatch:
jobs:
generate:
runs-on: ubuntu-latest
timeout-minutes: 10
steps:
# generates a snake game from a github user (<github_user_name>) contributions graph, output a svg animation at <svg_out_path>
- name: generate github-contribution-grid-snake.svg
uses: Platane/snk@master
with:
github_user_name: zhoufanglu
svg_out_path: dist/github-contribution-grid-snake.svg
# push the content of <build_dir> to a branch
# the content will be available at https://raw.githubusercontent.com/<github_user>/<repository>/<target_branch>/<file> , or as github page
- name: push github-contribution-grid-snake.svg to the output branch
uses: crazy-max/ghaction-github-pages@v2.5.0
with:
target_branch: output
build_dir: dist
env:
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
重点参数说明
3、执行&&使用
执行
- 保存后执行
- 执行完毕后会生成一个
output
分支, 里面就有你的svg地址
使用
- 在你的
markdown
内把地址贴上即可
![暗色](https://raw.githubusercontent.com/zhoufanglu/githubSNK/df18a4a2fb544d5fc0e692f98c3436e9dccaa547/github-contribution-grid-snake.svg#gh-dark-mode-only)
![亮色](https://raw.githubusercontent.com/zhoufanglu/githubSNK/df18a4a2fb544d5fc0e692f98c3436e9dccaa547/github-contribution-grid-snake.svg#gh-light-mode-only)