【好玩】在 GitHub 主页上玩转贪吃蛇

在探索如何为我的 GitHub 主页添加更多个性化元素的过程中,我偶然发现了一种在主页上展示贪吃蛇游戏的独特方法。受到这个想法的启发,我决定尝试实现它,并在此分享我的经验和学到的教训。

账号准备

首先,你需要一个 GitHub 账号。如果你还没有,那么首先创建一个吧!

建立仓库

接着,创建一个与你的 GitHub 用户名相同的仓库。这是一个特殊的仓库,GitHub 会特别处理,你在这个仓库的 README.md 文件中的内容会显示在你的 GitHub 个人主页上。

复制代码,执行 Action

使用以下 GitHub Actions 工作流程,自动生成贪吃蛇游戏的 SVG 动画,并将其推送到仓库中。你需要将这段 YAML 代码添加到 .github/workflows 目录下的一个新文件中,比如命名为 snake-game.yml

yaml 复制代码
name: generate animation

on:
  schedule:
    - cron: "0 */24 * * *"
  workflow_dispatch:
  push:
    branches:
      - master

jobs:
  generate:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v2
      - name: generate github-contribution-grid-snake.svg
        uses: Platane/snk/svg-only@v3
        with:
          github_user_name: ${{ github.repository_owner }}
          outputs: |
            dist/github-contribution-grid-snake.svg
            dist/github-contribution-grid-snake-dark.svg?palette=github-dark
        env:
          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
      - name: push to the output branch
        uses: crazy-max/ghaction-github-pages@v3.1.0
        with:
          target_branch: output
          build_dir: dist
        env:
          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

建立 README.md 文件,放上 SVG 图片

在你的仓库中创建一个 README.md 文件,并使用 Markdown 语法引入上面 Action 自动生成的 SVG 图片。

markdown 复制代码
![Snake animation](https://github.com/你的用户名/你的用户名/blob/output/github-contribution-grid-snake.svg)

比如:

踩坑和总结

在这个项目的实现过程中,我遇到了一些挑战和学习机会:

  1. 分支命名差异 :注意 GitHub 默认分支的命名可能是 mainmaster。根据你的实际情况修改工作流文件。

  2. 权限问题:刚开始时我遇到了权限不足的错误。经过研究,我发现需要正确设置 GitHub Actions 的权限,确保它有足够的权限来推送文件到仓库。

  3. 参考文章【好玩】如何在github主页放一条贪吃蛇

    解决方案包括使用个人访问令牌(PAT)并在仓库的 Settings > Secrets 中配置它。更重要的是,要确保在 Settings > Actions > General > Workflow permissions 中勾选 Read and write permissions

通过这次项目,我不仅学习到了如何在 GitHub 主页上添加贪吃蛇游戏,也对 GitHub Actions 和仓库权限设置有了更深的理解。希望我的经验能帮助到其他寻求为他们的 GitHub 主页添加趣味性元素的开发者。

当然可以。在文章或博客的结尾添加一个温馨的呼吁,鼓励读者互动,是一个很好的做法。这不仅能增加文章的可见度,还能提供反馈机会,让作者了解内容的影响力。以下是你可以在文末添加的示例文本:

如果你觉得这篇文章对你有帮助,不妨给个赞👍或在评论中分享你的想法!你的支持是我创作的最大动力

相关推荐
IT_陈寒23 分钟前
Python开发者必知的5大性能陷阱:90%的人都踩过的坑!
前端·人工智能·后端
流浪克拉玛依1 小时前
Go Web 服务限流器实战:从原理到压测验证 --使用 Gin 框架 + Uber Ratelimit / 官方限流器,并通过 Vegeta 进行性能剖析
后端
孟沐1 小时前
保姆级教程:手写三层架构 vs MyBatis-Plus
后端
星浩AI1 小时前
让模型自己写 Skills——从素材到自动生成工作流
人工智能·后端·agent
华仔啊4 小时前
为啥不用 MP 的 saveOrUpdateBatch?MySQL 一条 SQL 批量增改才是最优解
java·后端
武子康4 小时前
大数据-242 离线数仓 - DataX 实战:MySQL 全量/增量导入 HDFS + Hive 分区(离线数仓 ODS
大数据·后端·apache hive
砍材农夫5 小时前
TCP和UDP区别
后端
千寻girling5 小时前
一份不可多得的 《 Django 》 零基础入门教程
后端·python·面试
千寻girling5 小时前
Python 是用来做 AI 人工智能 的 , 不适合开发 Web 网站 | 《Web框架》
人工智能·后端·算法
贾铭5 小时前
如何实现一个网页版的剪映(三)使用fabric.js绘制时间轴
前端·后端