Pages

Sunday, 28 April 2024

ghiblog,用git issue写博客

 

基于Github Action自动生成并更新GitHub Issue博客的ReadMe

Why

现在很多人, 包括我, 在折腾了一堆个人博客的系统之后, 放弃了花哨的页面效果, 回过头来用Github Issue写博客.

但头疼的一点就是:
如果让其他人直接点到自己仓库的issues页面来看自己的文章的话, 只会看到issue的列表, 没有突出内容, 没有分类, 没有about me, 只有一条条的issue.

如果想解决上述的问题, 就要手动在发布issue之后, 手动更新README, 并且push到仓库, 那么你需要:

  • 一台电脑
  • 安装git
  • clone仓库
  • 修改README
  • push

很麻烦, 感觉慢慢没有了更新的动力 😢

How it works

利用Github Action提供的工作流, 结合GitHub的API来实现:

  1. 通过Github API获取当前仓库的信息, 如
  • 总issue数量
  • 总label数量
  • 每个label下的issues列表
  • 最新更新(创建)的是哪些issue
  1. 将这些信息组装出自己满意的README页面
  2. 更新仓库的README.md文件
  3. 提交README.md的变更到远程仓库, 到这里, 我们的痛点就解决了一半, 剩下就是将步骤1-4在创建issue, 修改issue, 删除issue, 为issue新增label, 从删除label等等的动作之后触发了。
  4. 集成Github Action, 设置触发条件为: on: [issues, issue_comment], 完成!

于是, 你只需要写Issue就好了, 剩下的交给Github Action 🎉

You want too?

如果你也想有一个自动更新的GitHub Issue博客, 那么参考以下步骤:

  1. fork此仓库到你的账号下
  2. 修改 .github/workflow/main.yml 的第 20, 25, 26, 30, 34行内容,具体改成什么你应该懂得。
  3. 在你的仓库中建以下几个label:

这些label目前是必须存在的,所以一定要先创建。

  • :+1:置顶
  • :framed_picture:封面
  • 开源
  1. 创建一个issue试试?

至此, 如果不出意外, 你的ghiblog的自动更新就完成了.

功能说明

置顶

只需要给你的issue打上 :+1:置顶 的标签即可。

封面图片

新建一个issue, 并给这个issue打上 :framed_picture:封面 标签,(最好只给一个issue打上此标签。)
这个issue中的所有评论内容都要遵循下面的格式:

图片
---
标题

如:

![致命女人 00_28_49 20191026-155316](https://user-images.githubusercontent.com/25657798/67616241-0132a080-f809-11e9-8bd9-319b65f6e3f0.png)
---
[ Why Women Kill ]

from https://github.com/jwenjian/ghiblog/issues/1 (这个比较花哨)

----------------------------------------------------------------------

mirror

  1. 下载 Mirror 的最新版本 地址

  2. 获取你的 hash 地址

  3. 修改 index.html

...

<script>
window.config = {
  organization: false, // 默认是 false,如果你的项目是属于 GitHub 组织 的,请设置为 true
  order: 'UPDATED_AT', // 文章排序,以 创建时间 或者 更新时间,可选值 'UPDATED_AT','CREATED_AT'
  title: 'Mirror', // 博客标题
  user: 'LoeiFy', // GitHub 用户名,必须
  repository: 'Recordum', // GitHub 项目名,指定文章内容来源 issues,必须
  authors: 'LoeiFy,author1', // 博客作者,以 ',' 分割,GitHub 用户名默认包含在内
  ignores: '17,13', // 文章忽略的 issues ID
  host: '', // 博客的主域名,不填自动获取,请注意这个值会影响 hash 的值
  hash: '', // 必须
  perpage: 5, // 分页
}
</script>

...

保存 index.html, 然后将所有文件 push 到 gh-pages 分支或者 master 分支的 docs 目录.

from https://github.com/LoeiFy/Mirror/wiki/%E4%B8%AD%E6%96%87%E6%95%99%E7%A8%8B

(A blogging tool powered by GitHub API. Write your blog on GitHub issue.)

(Development

Before start

  1. install falco global, $ npm i @fratercula/falco -g

  2. fork and install modules $ npm install

  3. get your hash

  4. copy ./index.sample.html to ./index.html, and set the config values

$ npm start # start
$ npm run build # build
$ npm run lint # lint
from https://github.com/LoeiFy/Mirror/wiki/Development) 
-------------------------------------------

基于Github Issues的博客搭建

from https://github.com/superleeyom/blog/issues/38 

(demo: https://blog.leeyom.top) 


No comments:

Post a Comment