Github 贪吃蛇 主页设置

  • 自动化脚本
    • 顶部元信息
    • 触发条件(`on:`)
    • 作业(`jobs:`)
    • 步骤(`steps:`)
      • 1. 生成 SVG
      • 2. 推送到 `output` 分支
  • Commit & Push
  • 在 README 里引用

参考:https://github.com/Platane/Platane/tree/master

首先写个自动化脚本 .github/workflows/snake.ymlGitHub Actions 会按计划去生成并提交最新版的 “贪吃蛇” SVG。紧接着,再在你的 README.md 中引用它,就能看到效果啦!

自动化脚本

这一部分是 每天/每次你推代码/手动运行 时,自动生成最新的两张 SVG:浅色和深色「贪吃蛇贡献动画」;然后把它们提交到 output 分支。
在这里插入图片描述

首先,登录后,点击仓库页面上方的 Add fileCreate new file,在 “Name your file…” 的输入框中,直接输入路径:.github/workflows/snake.yml,在下方的大编辑区域,粘贴 workflow 内容:

# workflow name
name: generate animationon:# run automatically every 24 hoursschedule:- cron: "0 */24 * * *" # allows to manually run the job at any timeworkflow_dispatch:# run on every push on the master branchpush:branches:- masterjobs:generate:permissions: contents: writeruns-on: ubuntu-latesttimeout-minutes: 5steps:# 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.svguses: Platane/snk/svg-only@v3with:github_user_name: ${{ github.repository_owner }}outputs: |dist/github-contribution-grid-snake.svgdist/github-contribution-grid-snake-dark.svg?palette=github-dark# 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 branchuses: crazy-max/ghaction-github-pages@v3.1.0with:target_branch: outputbuild_dir: distenv:GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

这段 GitHub Actions 的 YAML 文件是用来定时(和按需/每次推送)自动生成「贪吃蛇贡献动画」SVG,然后把它们发布到指定分支上的。

顶部元信息

name: generate animation
  • 给这个 Workflow 起了个名字 “generate animation”。

触发条件(on:

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

    • cron: "0 */24 * * *" 表示每天整点触发一次(等同于“每 24 小时执行一次”)。
  2. workflow_dispatch

    • 允许你在 GitHub 界面上手动点击 “Run workflow” 来触发。
  3. pushmaster 分支

    • 只要有人往 master 分支 push 代码,就会触发这个 Workflow。
    • 当你在仓库的 master(或 main)分支上做任何提交/推送操作时,GitHub 都会发出一个 “push” 事件,触发对应配置中定义了 push: branches: [master] 的工作流。

这样就保证了:

  • 自动定时更新
  • 可以手动随时更新
  • 每次推 master 时也会更新

Tip:现在很多仓库默认主分支名字是 main 而不是 master,如果你的主分支叫 main,记得把配置改成:

on:push:branches:- main

这样才会在你真正常用的主分支推送时触发工作流。

  • 进入你仓库主页,在页面正中偏上,有一个下拉框写着 “Branch: …”,它默认显示的那个分支,就是你的主分支名称(比如 mainmaster)。
  • 或者点进 Settings → Branches(左侧菜单),在 “Default branch” 一栏就能看到。

作业(jobs:

jobs:generate:permissions: contents: writeruns-on: ubuntu-latesttimeout-minutes: 5
  • generate:作业 ID,随便起名。
  • permissions: contents: write:给这个作业写权限,才能往分支里提交文件。
  • runs-on: ubuntu-latest:在最新的 Ubuntu 虚拟机上跑。
  • timeout-minutes: 5:如果跑超 5 分钟还没结束,就强制终止。

步骤(steps:

1. 生成 SVG

- name: generate github-contribution-grid-snake.svguses: Platane/snk/svg-only@v3with:github_user_name: ${{ github.repository_owner }}outputs: |dist/github-contribution-grid-snake.svgdist/github-contribution-grid-snake-dark.svg?palette=github-dark
  • uses: Platane/snk/svg-only@v3
    调用了社区提供的 Platane/snk Action,只要给它 GitHub 用户名,就能抓取该用户的过去一年贡献热图,并在上面绘制“贪吃蛇”动画

  • github_user_name: ${{ github.repository_owner }}
    自动传入仓库的拥有者用户名(也就是你自己的 GitHub 用户名),无需硬编码。

  • outputs

    • dist/github-contribution-grid-snake.svg:生成的浅色主题 SVG。
    • dist/github-contribution-grid-snake-dark.svg?palette=github-dark:生成的深色主题 SVG(通过 query 参数切换配色)。

生成后会把两个文件都放进工作目录下的 dist/ 文件夹。

2. 推送到 output 分支

- name: push github-contribution-grid-snake.svg to the output branchuses: crazy-max/ghaction-github-pages@v3.1.0with:target_branch: outputbuild_dir: distenv:GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
  • uses: crazy-max/ghaction-github-pages@v3.1.0
    这是一个方便把某个目录内容发布到指定分支(通常用于 GitHub Pages 或存放生成文件)的 Action。
  • target_branch: output
    dist/ 目录下的文件推送到当前仓库的 output 分支。
  • build_dir: dist
    指定要发布的本地目录就是前一步生成的 dist/
  • GITHUB_TOKEN
    内置的 secrets.GITHUB_TOKEN 用来做认证,允许写入 output 分支。

Commit & Push

编辑完上述 .github/workflows/snake.yml 后,Commit & Push 到 GitHub,等 Action 跑完,检查 output 下是否有两张 svg

在这里插入图片描述
在这里插入图片描述

在 README 里引用

更新 README 中的 链接指向这两个 SVG,

<picture><source media="(prefers-color-scheme: dark)"srcset="https://raw.githubusercontent.com/你的用户名/你的仓库/output/github-contribution-grid-snake-dark.svg"><source media="(prefers-color-scheme: light)"srcset="https://raw.githubusercontent.com/你的用户名/你的仓库/output/github-contribution-grid-snake.svg"><img alt="🐍 Snake eating contributions"src="https://raw.githubusercontent.com/你的用户名/你的仓库/output/github-contribution-grid-snake.svg">
</picture>

再次 Commit & Push,刷新你的个人主页,就能看到「贪吃蛇吃你的贡献」在 README 里动起来了 🎉

这样,你的个人主页上就会不断更新,展示一个真正基于你自己 GitHub 活动数据的「贪吃蛇」动画了。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如若转载,请注明出处:http://www.pswp.cn/news/915312.shtml
繁体地址,请注明出处:http://hk.pswp.cn/news/915312.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

关于Spring RestTemplate

​ 一、概述RestTemplate 是 Spring Framework 提供的一个同步 HTTP 客户端工具&#xff0c;用于简化与 RESTful API 的交互。它封装了底层 HTTP 通信细节&#xff0c;提供了统一的 API 来发送各种 HTTP 请求&#xff08;GET、POST、PUT、DELETE 等&#xff09;&#xff0c;并自…

异步解决一切问题 |消息队列 |减少嵌套 |hadoop |rabbitmq |postsql

设计准则“为什么要考虑这个问题”The forward logic is only about 10% of your code, everything else is 90%.主流逻辑 10%保障扩容和稳健的代码设计90%同步代码就是绑在一个绳上的蚂蚱异步就是实现了解耦这个异步或许有点类似于--一些分布式数据的处理 设计如何实现的呢?…

Spring AI 项目实战(十八):Spring Boot + AI + Vue3 + OSS + DashScope 实现高效语音识别系统(附完整源码)

系列文章 序号 文章名称 1 Spring AI 项目实战(一):Spring AI 核心模块入门 2 Spring AI 项目实战(二):Spring Boot + AI + DeepSeek 深度实战(附完整源码) 3 Spring AI 项目实战(三):Spring Boot + AI + DeepSeek 打造智能客服系统(附完整源码) 4

指针数组和数组指针的应用案例

1. 指针数组应用&#xff1a;查找最长字符串用指针数组存储若干字符串&#xff0c;编写函数找出其中最长的字符串&#xff08;若有多个&#xff0c;返回第一个&#xff09;。#include <stdio.h> #include <string.h>// 函数原型&#xff1a;找出最长字符串 const c…

MCU进入低功耗模式前的引脚处理原则和方法 --> 以最小化低功耗电流

在MCU进入低功耗模式(如Sleep, Stop, Standby, Deep Sleep等)前,精心处理每一个GPIO引脚的状态是最大限度降低功耗电流的关键一步。悬空或配置不当的引脚是导致“漏电”的常见原因。以下是处理引脚以达到最小低功耗电流的原则和方法: 📌 核心原则 避免浮空输入: 浮空(…

张 关于大语言模型(LLM)置信度研究的经典与前沿论文 :温度缩放;语义熵;自一致性;事实与反思;检索增强;黑盒引导;

关于大语言模型(LLM)置信度研究的经典与前沿论文 :温度缩放;语义熵;自一致性;事实与反思;检索增强;黑盒引导; 目录 关于大语言模型(LLM)置信度研究的经典与前沿论文 :温度缩放;语义熵;自一致性;事实与反思;检索增强;黑盒引导; 一、校准方法:让模型概率更贴近真实正确…

ICT测试原理之--什么是假短

ICT测试原理之–什么是假短 文章目录ICT测试原理之--什么是假短一、假短的由来防止假短二、无法检测的短路示例解决无法检测的短路调试短路文件调试意外断路调试意外短路三、调试假短报告短路和断路报告假短报告短路设备/引脚功能性短路测试功能性短路测试的语法一、假短的由来…

三种深度学习模型(LSTM、CNN-LSTM、贝叶斯优化的CNN-LSTM/BO-CNN-LSTM)对北半球光伏数据进行时间序列预测

代码功能 该代码实现了一个光伏发电量预测系统&#xff0c;采用三种深度学习模型&#xff08;LSTM、CNN-LSTM、贝叶斯优化的CNN-LSTM&#xff09;对北半球光伏数据进行时间序列预测&#xff0c;并通过多维度评估指标和可视化对比模型性能。 算法步骤 1. 数据预处理 数据导入&am…

Typecho+阿里云CDN完整配置:防止DDoS攻击与IP暴露

文章目录 Typecho使用阿里云CDN保护网站真实IP地址的完整指南 背景与问题分析 技术选型与方案设计 详细实施步骤 第一步:阿里云CDN基础配置 第二步:DNS解析设置 第三步:源站服务器防护配置 Nginx服务器配置 防火墙配置(以Ubuntu为例) 第四步:Typecho配置调整 高级防护措施…

[硬件]运算放大器对相位噪声的影响与设计提示

运算放大器对相位噪声的影响与设计提示 文章目录运算放大器对相位噪声的影响与设计提示运放影响位噪声的主要因素如何最小化运放对相位噪声的影响总结运算放大器是常用的模拟电路元器件&#xff0c;通常用于放大信号&#xff0c;增强驱动。但是当使用运放放大一个信号时&#x…

github jekyll+chirpy主题搭建博客

github jekyllchirpy主题搭建博客 标签&#xff1a;后端、blog、jekyll 全文链接 本文简要介绍了如何基于 GitHub Pages、Jekyll 及 Chirpy 主题搭建个人博客的流程和注意事项。 主要内容 GitHub Pages 站点简介 可免费搭建个人博客&#xff0c;支持自定义域名&#xff0c;适…

Flutter状态管理篇之ValueNotifier(三)

目录 前言 一、ValueNotifier 概述 二、ValueNotifier 的实现原理 1.类定义 1.类定义 2.关键字段 3.关键方法 1.构造函数 2.getter:value 3.setter:value: 4.toString 2.继承自ChangeNotifier的机制 3.ValueListenable 接口 三、ValueNotifier 的用法 1.基本用法…

Ubuntu togo 系统安装指南

制作一个 “Ubuntu To Go” 系统&#xff08;也就是一个可以随身携带、在不同电脑上启动并拥有持久化存储的U盘系统&#xff09;是解决你问题的完美方案。 这样一来&#xff0c;你就可以&#xff1a; 不改动你现有的电脑系统 (保留你的Ubuntu 20.04 或 Windows)。拥有一个完整…

Python爬虫实战:研究pefile库相关技术

一、引言 可执行文件(Portable Executable,PE)是 Windows 操作系统中最常见的文件格式,包括.exe、.dll、.sys 等多种类型。对 PE 文件的分析在软件逆向工程、恶意软件检测、系统安全研究等领域具有重要意义。传统的 PE 文件分析主要依赖手动操作和专业工具,效率较低且对分…

盟接之桥说制造:差异化定位与效率竞争的双轮驱动

在当今竞争日益激烈的商业环境中&#xff0c;企业如何在市场中脱颖而出&#xff0c;既避免陷入同质化的价格战&#xff0c;又能够通过效率提升实现可持续发展&#xff0c;是每一个经营者必须思考的问题。本文将围绕“差异化”与“效率竞争”两大核心战略展开分析&#xff0c;探…

Vue基础(前端教程①-路由)

项目结构src/├── router/│ └── index.js # 路由配置├── components/│ ├── Home.vue # 首页组件│ ├── About.vue # 关于页组件│ └── Contact.vue # 联系页组件├── App.vue # 根组件&#xff08;含导航栏&…

驾驭 Spring Boot 事件机制:8 个内置事件 + 自定义扩展实战

驾驭 Spring Boot 事件机制&#xff1a;8 个内置事件 自定义扩展实战在 Spring Boot 应用的完整生命周期中&#xff0c;框架为我们预埋了 8 个关键事件&#xff08;Application-level & Context-level&#xff09;。 理解并善用这些事件&#xff0c;可以在“不侵入框架、…

【kafka4源码学习系列】kafka4总体架构介绍

二 kafka架构介绍学习一个系统之前很重要的一点就是先了解这个系统整体的架构&#xff0c;这能够使我们对整个系统有个总体的认识&#xff0c;清楚地知道这个系统有什么能力。这不仅帮助我们学习时快速定位到我们想要的内容&#xff0c;还能避免我们学习过程中在庞大的系统中迷…

java内存图

java内存图java文件运行流程程序的内存空间认识虚拟机栈程序的执行流程认识堆java的类与对象的关系java文件运行流程 有这样的一份 java 文件 在该目录下的终端运行 javac Hello.java 命令&#xff0c;会生成 Hello.class 文件&#xff0c;内容如下&#xff1a; Hello.java 打…

vscode编辑Markdown文件

一.安装Markdown的插件 vscode的扩展&#xff0c;搜索Markdown Preview Enhanced的插件&#xff0c;并安装。 其他的常用插件&#xff0c;还包括&#xff1a; Markdown All in One &#xff1a;提供了许多有用的功能&#xff0c;如快捷键支持、自动预览、TOC&#xff08;目录&…