二丫讲梵 二丫讲梵
首页
  • 最佳实践
  • 迎刃而解
  • Nginx
  • Php
  • Zabbix
  • AWS
  • Prometheus
  • Grafana
  • CentOS
  • Systemd
  • Docker
  • Rancher
  • Ansible
  • Ldap
  • Gitlab
  • GitHub
  • Etcd
  • Consul
  • RabbitMQ
  • Kafka
  • MySql
  • MongoDB
  • OpenVPN
  • KVM
  • VMware
  • Other
  • ELK
  • K8S
  • LLM
  • Nexus
  • Jenkins
  • 随写编年
  • 家人物语
  • 追忆青春
  • 父亲的朋友圈
  • 电影音乐
  • 效率工具
  • 博客相关
  • Shell
  • 前端实践
  • Vue学习笔记
  • Golang学习笔记
  • Golang编程技巧
  • 学习周刊
  • Obsidian插件周刊
关于
友链
  • 本站索引

    • 分类
    • 标签
    • 归档
  • 本站页面

    • 导航
    • 打赏
  • 我的工具

    • 备忘录清单 (opens new window)
    • json2go (opens new window)
    • gopher (opens new window)
    • 微信MD编辑 (opens new window)
    • 国内镜像 (opens new window)
    • 出口IP查询 (opens new window)
    • 代码高亮工具 (opens new window)
  • 外站页面

    • 开往 (opens new window)
    • ldapdoc (opens new window)
    • HowToStartOpenSource (opens new window)
    • vdoing-template (opens new window)
GitHub (opens new window)

二丫讲梵

行者常至,为者常成
首页
  • 最佳实践
  • 迎刃而解
  • Nginx
  • Php
  • Zabbix
  • AWS
  • Prometheus
  • Grafana
  • CentOS
  • Systemd
  • Docker
  • Rancher
  • Ansible
  • Ldap
  • Gitlab
  • GitHub
  • Etcd
  • Consul
  • RabbitMQ
  • Kafka
  • MySql
  • MongoDB
  • OpenVPN
  • KVM
  • VMware
  • Other
  • ELK
  • K8S
  • LLM
  • Nexus
  • Jenkins
  • 随写编年
  • 家人物语
  • 追忆青春
  • 父亲的朋友圈
  • 电影音乐
  • 效率工具
  • 博客相关
  • Shell
  • 前端实践
  • Vue学习笔记
  • Golang学习笔记
  • Golang编程技巧
  • 学习周刊
  • Obsidian插件周刊
关于
友链
  • 本站索引

    • 分类
    • 标签
    • 归档
  • 本站页面

    • 导航
    • 打赏
  • 我的工具

    • 备忘录清单 (opens new window)
    • json2go (opens new window)
    • gopher (opens new window)
    • 微信MD编辑 (opens new window)
    • 国内镜像 (opens new window)
    • 出口IP查询 (opens new window)
    • 代码高亮工具 (opens new window)
  • 外站页面

    • 开往 (opens new window)
    • ldapdoc (opens new window)
    • HowToStartOpenSource (opens new window)
    • vdoing-template (opens new window)
GitHub (opens new window)
  • 最佳实践

  • 迎刃而解

  • Nginx

  • Php

  • Zabbix

  • AWS

  • Prometheus

  • Grafana

  • Loki

  • CentOS

  • Supervisord

  • Systemd

  • Docker

  • Docker-Compose

  • Rancher

  • Ansible

  • OpenLdap

  • GitLab

  • GitHub

    • GitHub中开源项目维护流程手册
    • 分享我的开源项目Thank-Mirror
    • 2024年重磅开源项目 awesome-ops 已收录项目500个
    • 分享我的开源项目Cloud_Dns_Exporter,妈妈再也不担心我忘换证书了
    • 一个仅需三步配置就能生成免费个人博客的开源模板vdoing-template
    • 如何将个人的GitHub主页配置的优雅好看
      • 展示
      • 参考
      • 折腾
        • 开头的动图
        • 内容与构图
        • 欢迎来访部分
        • 语言工具
        • 状态汇总统计
        • 动态贪吃蛇
        • 提交动态折线图
        • 类似 GitHub Pinned 的功能
        • 博客最近更新
    • 利用GitHub Actions自动为README添加TOC目录
    • 利用GitHub Actions自动将项目贡献者列表添加到README中
    • 利用GitHub Actions自动优雅地为项目构建Releases
    • 利用GitHub Actions自动获取博客rss文章
    • 利用GitHub Actions自动构建项目的docker镜像并发布到DockerHub
    • 利用GitHub Actions自动生成GitHub的Fans
    • 利用GitHub Actions自动生成个人star列表并归类
    • 利用GitHub Actions自动对仓库内图片进行无损压缩
    • 利用GitHub Actions自动检测项目中的问题链接
    • 利用GitHub Actions自动构建go项目的二进制到release
    • 利用github-slug-action暴漏Github Action上下文中的关键变量
    • 利用Github Action自动检测项目中 yaml 或 json 的语法
    • 记录最近在Github Action配置实践中的几个新的收获
    • VMR一个开源的通用SDK版本管理器
  • Etcd

  • Consul

  • RabbitMQ

  • Kafka

  • Mysql

  • MongoDB

  • OpenVPN

  • Kvm

  • VMware

  • 配置文件详解

  • Other

  • 运维观止
  • GitHub
二丫讲梵
2022-07-23
目录

如何将个人的GitHub主页配置的优雅好看

文章发布较早,内容可能过时,阅读注意甄别。

我很早注意到,GitHub 当中,你创建一个与自己账号同名的仓库,然后这个仓库的内容会展示在个人主页,换言之,你可以通过装扮这个仓库,来实现个人主页的装扮。

曾经也做过一些装扮的事情,只是很多内容还停留在表面,以至于主页看起来比较简单,最近对主页进行了整体的改造,过程中也遇到不少好的经验,这篇文章就是对这些内容的总结整理,看完之后,你也可以快速构建一个美观简洁的个人主页,这是一张重要的个人名片,快装扮起来吧。

我的个人主页:https://github.com/eryajf (opens new window)

题外话:在折腾主页的过程中,我发现一个现象,国内的程序员折腾个人主页的比例要远远小于国外,也许,正是因为国内程序员都被困在 996 当中而失去了生活的情趣罢,再一次,旗帜鲜明地反对 996。

# 展示

# 参考

我们制作个人主页的第一步,在没有思路的时候,首先可以做的,就是参考别人的做法,先从模仿开始,然后再从模仿的过程中,逐渐摸索出能够展示自己个性的一套主页。

  • 首先你可以参考我的主页全部配置,来进行个人主页的折腾配置。
  • GitHub 中也有不少搜集了优秀配置的仓库,这里列举一二:
    • awesome-github-profile-readme-chinese (opens new window):由我整理的优秀的中文区个人主页搜集,特别推荐。
    • awesome-github-profile-readme (opens new window):收集了大量的优秀案例,可供参考。
    • awesome-github-profile-readme-templates (opens new window):整理了大量的优秀模板,可供参考。
    • creative-profile-readme (opens new window):又一个整理了大量案例的仓库。

# 折腾

接下来我讲下个人主页的内容是如何制作的,以给想要参考的同学一个思路。

# 开头的动图

效果如下:

此功能基于如下项目构建:

  • 源码:readme-typing-svg (opens new window)
  • 在线:readme-typing-svg-demo (opens new window)

你可以在在线工具中制作个人想要展示的内容。

# 内容与构图

前边内容就不多说了,每个人根据自己的实际想法撰写即可,图片也是基于 HTML 的右置语法实现。如下:

# 欢迎来访部分

此处内容分两部分,一个是访问次数计数,一个是其他图标内容的展示。

访问次数功能基于如下项目构建:

  • 源码:visitor-badge (opens new window)
  • 在线:visitor-badge-online (opens new window)

后边的图标内容根据如下网站提供能力构建:

  • shields (opens new window)

# 语言工具

语言工具部分配置也比较简单,不过想要搜集齐自己的语言工具包,也是需要耗费一番功夫的。

其中图标功能基于如下项目配置:

  • 源码:devicon (opens new window)
  • 在线:devicon.dev (opens new window)

如果有图标在里边搜索不到,可以自己去对应语言或者工具的官网寻找 icon 图标。

# 状态汇总统计

状态汇总建议你不必过多纠结,直接参照我的配置,将 owner 名字替换就 OK 了:

![二丫讲梵's github stats](https://github-readme-stats.vercel.app/api?username=eryajf&hide_title=false&hide_border=true&show_icons=true&include_all_commits=true&line_height=20&bg_color=0,EC6C6C,FFD479,FFFC79,73FA79&theme=graywhite&locale=cn)![主要使用语言](https://github-readme-stats.vercel.app/api/top-langs/?username=eryajf&hide_title=false&hide_border=true&layout=compact&bg_color=0,73FA79,73FDFF,D783FF&theme=graywhite&locale=cn)

![profile](https://github-profile-trophy.vercel.app/?username=eryajf&theme=algolia&column=8)
1
2
3

其中状态汇总基于如下项目构建:

  • 源码:github-readme-stats (opens new window)
  • 中文:README (opens new window)

奖杯功能基于如下项目构建:

  • 源码:github-profile-trophy (opens new window)
  • 可根据说明文档自行调整配置。

# 动态贪吃蛇

首先看配置内容:

![snake](./assets/github-contribution-grid-snake.svg)
1

引用了仓库本地的一个 svg 文件,此文件借助一个GitHub Actinos每天自动生成一次。

配置如下:

name: Generate Snake
on:
  schedule:
    - cron: "0 0 * * *"
  workflow_dispatch:
jobs:
  build:
    runs-on: ubuntu-latest
    steps:
      - name: Checkout
        uses: actions/checkout@v2.3.4
      - name: Generate Snake
        uses: Platane/snk@master
        id: snake-gif
        with:
          github_user_name: ${{ github.repository_owner }}
          gif_out_path: ./assets/github-contribution-grid-snake.gif
          svg_out_path: ./assets/github-contribution-grid-snake.svg
      - name: Push to GitHub
        uses: EndBug/add-and-commit@v7.2.1
        with:
          branch: master
          message: "Generate Contribution Snake"
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

此功能基于如下项目构建:

  • 源码:snk (opens new window)
  • 在线:snk-online (opens new window)

# 提交动态折线图

配置内容如下:

![](https://activity-graph.herokuapp.com/graph?username=eryajf&theme=github)
1

如果你觉得我用的样式可以,那么直接替换 username 就可以生成你自己的。

此功能基于如下项目构建:

  • 源码:github-readme-activity-graph (opens new window)
  • 在线:github-readme-activity-graph-online (opens new window)

# 类似 GitHub Pinned 的功能

GitHub Pinned 是一个能够将项目钉在个人主页的功能,效果如下:

但有一个问题,此功能只允许我们添加 6 个项目钉在这里。

通过如下配置,我们可以将更多自己想要钉住的项目钉在个人主页:

[![Readme Card](https://github-readme-stats.vercel.app/api/pin/?username=eryajf&repo=ldapctl&show_owner=true&&theme=cobalt)](https://github.com/eryajf/ldapctl)
1

此功能基于如下项目构建:

  • 源码:github-readme-stats (opens new window)
  • 中文:README (opens new window)

# 博客最近更新

此处功能是基于 GitHub Actions 实现,每个小时运行一次,通过订阅博客的 RSS 将博客最近更新的几篇文章列举在此:

GitHub Actions 配置如下:

name: Latest blog post workflow
on:
  schedule: # Run workflow automatically
    - cron: "0 * * * *"
  workflow_dispatch:
jobs:
  update-readme-with-blog:
    name: Update this repo's README with latest blog posts
    runs-on: ubuntu-latest
    steps:
      - name: Checkout
        uses: actions/checkout@v2
      - name: Pull in eryajf posts
        uses: gautamkrishnar/blog-post-workflow@v1
        with:
          max_post_count: 6
          committer_username: "eryajf"
          committer_email: "eryajf@163.com"
          feed_list: "https://wiki.eryajf.net/rss.xml"
          template: "$newline- $randomEmoji(💯,🔥,💫,🚀,🌮,📝,🥳,💻,🧰,🏊,🥰,🧐,🤓,😎,🥸,🤩,🤗,🤔,🫣,🤭,🤠,👹,👺,🤡,🤖,🎃,😺,🫶,👍,💪,💄,👀,🧠,🧑‍🏫,👨‍🏫,💂,🧑‍💻,🥷,💃,🕴,💼,🎓,🐻,🐵,🙉,🦄,🦆,🦅,🦍,🦣,🐘,🦒,🦏,🐎,🦩,🐲,🌝,🌜,🌏,🌈,🌊,🎬,🎭,🚀,🚦,⛽️,🗽,🎡,🌋,🌁,💡,🕯,🪜,🧰,⚗️,🔭,🪄,🎊,🎉,) [$title]($url) $newline"
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

此功能基于如下项目构建:

  • 源码:blog-post-workflow (opens new window)

以上就是我个人主页配置的全部内容了。

最后有以下几点内容想表达:

  • 几乎每个功能都依赖于开源项目的实现,开源的魅力,正在于,我用你的开源,你用我的开源!

  • 我想,个人主页的一大乐趣,正在于折腾,折腾之乐,无穷尽也!

  • 也但愿国内开发者的个人主页早日遍地开花,百家争鸣起来!!

微信 支付宝
上次更新: 2024/09/26, 21:41:44
一个仅需三步配置就能生成免费个人博客的开源模板vdoing-template
利用GitHub Actions自动为README添加TOC目录

← 一个仅需三步配置就能生成免费个人博客的开源模板vdoing-template 利用GitHub Actions自动为README添加TOC目录→

最近更新
01
学习周刊-总第212期-2025年第21周
05-22
02
从赵心童世锦赛夺冠聊聊我的斯诺克情缘
05-16
03
学习周刊-总第211期-2025年第20周
05-15
更多文章>
Theme by Vdoing | Copyright © 2017-2025 | 点击查看十年之约 | 浙ICP备18057030号
  • 跟随系统
  • 浅色模式
  • 深色模式
  • 阅读模式