赞
踩
最近看微信上有技术公众号在发关于Github主页自定义的功能的推文
就索性看了看,也自己动手搞了搞,毕竟如此酷炫!
下面简单介绍一下,步骤非常简单:
1. 创建一个和自己Github同名的仓库
这个同名仓库是一个非常具有魔力的哦,参看下面的图片。注意需要使得这个仓库是public状态,并且初始化一个README文件
2. 在README文件中使用markdown语法设计创造主页内容
和其他项目的readme类似,这里需要使用markdown语法来写内容,可以设计一些非常好玩的东西,尽情发挥自己的想象力。
在介绍完基本步骤之后,来给大家介绍几个比较有趣的东西,丰富自己的主页内容。
1. 制作自己喜爱的徽章(Badge)
这个网站提供了很多徽章的类型,可以自己根据情况选择,当然也可以自定义徽章。主要包括了:构建、代码覆盖率、分析
闲谈,聊天、依赖关系、大小、下载等等。
当在网站上设计好徽章之后,只需要将生成的URL放到README中,就可以在主页上看到啦,非常简单。
2. 展示自己的Github点星,提交等情况
利用Github官方提供的API接口,我们可以得到用户自己的项目情况。

只需要把上面的红色字体的部分换成自己的信息,就可以啦。例如:
欢迎来我Github帮忙点星,关注!
3. 统计代码时常
这个功能非常有趣,这里我们要利用WakaTime对事情的统计功能,并绑定到Github来实现展示。官网:WakaTime
下面详细讲一下如何部署到Github:
1. 登录WakaTime官网,注册 一个WakaTime 账号
这里我是直接绑定的Github账号登录,非常方便,推荐!
2. 在自己常用的 IDE 上下载 WakaTime 插件,配置上自己的 API Key
当注册好账号后,你会得到属于自己专属的API Key。然后在需要监控工作的IDE里安装WakaTime的插件,并配上自己的Key。官方上有非常详细的配置步骤,如下以WebStorm为例:
到此为止,其实本地的开发环境就已经被WakaTime所监控啦,数据会被传输到WakaTime然后在dashboard中展示。
除WebStorm外,WakaTime还支持很多其他的开发环境,如下:
3. 将自己的 API Key 存到自己 Github 仓库的 secrets中
从项目里点击Setting -> Secrets -> New secret 创建一个。其中name需要填写WAKATIME_API_KEY,value就把WakaTime官网生成的API Key粘贴进去就行。
4. 配置 GitHub 仓库的 Actions
我们还需要在项目里配置Actions。点击 Actions -> New workflow
把默认的内容全部删除,把下面的内容粘贴上:
- name: Waka Readme
-
- on:
- push:
- branches:
- - master
- workflow_dispatch:
- schedule:
- # Runs at 12am UTC
- - cron: '0 0 * * *'
-
- jobs:
- update-readme:
- name: Update this repo's README
- runs-on: ubuntu-latest
- steps:
- - uses: MartinYan623/waka-readme@master
- with:
- WAKATIME_API_KEY: ${{ secrets.WAKATIME_API_KEY }}

这里需要改的是uses中的地方换成你自己的路径。
如果出现以下这个报错信息,则是因为uses中的路径错误。如下所示:
注意:这里需要一个waka-readme的项目,请将https://github.com/athul/waka-readme中的项目fork到自己仓库里就行! 之前没发现需要fork利用别人写好的东西,结果写的workflow action跑不起来,这里替你们踩坑了!
5. 点击 Waka Readme ,再点击run
当你看到正常跑起来之后,就离胜利不远啦!
6. 再README文件中添加以下这段文字:
<!--START_SECTION:waka-->
<!--END_SECTION:waka-->
添加修改后,再次提交commit。然后,返回到主页,会看到以下这样,说明WakaTime其实已经关联上你的Github啦!需要等待一段时间(一天),就会同步到Github啦!
再给大家推荐一个好的项目,里面收集了很多关于主页的模版,大家可以参考下别人的设计思路!
模版项目:Awesome-Profile-README-templates
最后我的Github HomePage展示!链接:https://github.com/MartinYan623
如果这篇文章对你有帮助,不妨给我点个赞或收藏一下,谢谢!之后有新的设计思路还会不断更新,希望大家都能设计出属于自己的cool homepage !
参考资料:
1. https://blog.csdn.net/weixin_46233323/article/details/107485962
2. https://blog.csdn.net/qq_42907802/article/details/107464900
3. https://github.com/kautukkundan/Awesome-Profile-README-templates
Copyright © 2003-2013 www.wpsshop.cn 版权所有,并保留所有权利。