创建杀手级 GitHub 个人资料自述文件（第二部分）

欢迎阅读本系列文章的第 2 部分，我将向您展示如何创建杀手级 GitHub 个人资料！

如果您还没有阅读第 1 部分，请单击此处并在阅读本文之前继续关注。

在上一篇文章中，我记录了我构建README.template.md文件的过程。

我添加了简介、最新博客文章、固定存储库、GitHub 统计数据、技能和 Office 报价的骨架部分。

在本系列的第二篇文章和最后一期中，我将添加动态内容注入并让您熟悉 GitHub Action 工作流程！

为魔法做准备

现在README.template.md文件已经完成，我开始着手有趣的部分——动态注入。

该文件有两个主要部分需要动态内容注入——博客部分和 Office 引用部分。

列出最近的博客文章是比较容易的部分——该功能是为我构建的（请参阅上一篇文章中的链接教程），我只需要连接工作流程。

然而，Office 的报价需要更多努力，因为我需要自己创建功能。对于像发出 API 请求这样简单的事情，我决定创建一个简单的节点脚本来处理操作。

在我的存储库的根目录下，我创建了一个名为的新文件index.js。

index.js 文件

此文件需要完成四个步骤：

创建变量来引用README.template.md文件
向 Office API 发出请求
查看README.template.md内容并将静态模式（{office_quote}& {office_character}）替换为 API 请求的动态结果
README.md使用更新的参考变量创建/替换文件的内容README.template.md。

考虑到这些职责，我在index.js文件中导入了所需的依赖项。

require("isomorphic-unfetch");
const { promises: fs } = require("fs");
const path = require("path");

为了完成第一步，我声明了一个名为的异步函数main，获取了对模板文件的引用并将其放在名为的变量中readmeTemplate。

async function main() {
    const readmeTemplate = (
        await fs.readFile(path.join(process.cwd(), "./README.template.md"))
    ).toString("utf-8");
}
main();

下一步是发出 API 请求。在readmeTemplate变量下方，我创建了一个对 Office API 的请求，并将结果赋值给了一个名为的变量office_quote。

const office_quote = await (
    await fetch("https://officeapi.dev/api/quotes/random")
).json();

第三步是使用从 Office API 检索到的动态内容替换模板文件中的模式。

const readme = readmeTemplate
        .replace("{office_quote}", office_quote.data.content)
        .replace("{office_character}", `- ${office_quote.data.character.firstname} ${office_quote.data.character.lastname}`)

README.md最后，我用变量创建/替换文件的内容readmeTemplate。

await fs.writeFile("README.md", readme);

此时，我可以node .在存储库的根目录下运行，该index.js文件就发挥了它的魔力。打开README.md文件后，我在文件底部看到了动态引号。

如果您想引用我的完整index.js文件，请单击此处。

创建工作流

该index.js文件本身没什么用，因为我每次想要更新引文时都需要运行它。如何让该文件自动运行？GitHub Actions。

如果我有正确的文件结构，设置 GitHub Action 工作流程很容易；我不需要在 GitHub 网站上做任何事情就可以让它工作。

我在我的存储库的根目录下创建了以下目录和文件：

- root
  - .github
      workflows
        dynamic-injection-workflow.yml

接下来，我打开dynamic-injection-workflow.yml文件，命名了工作流，并添加了一些关于工作流运行时间的指令。我设置了一个 cron 作业，每小时运行一次这个工作流，这样就可以频繁地获取新的博客文章，并让访问者定期收到新的 Office 报价。

name: Dynamic README injection
on:
  schedule: # Run workflow automatically
    # This will make it run every hour
    - cron: "0 * * * *"
    # Run workflow manually (without waiting for the cron to be called), through the Github Actions Workflow page directly

现在我已经有了工作流程的基本结构，我需要定义工作流程要运行的作业。

这些工作的顺序很重要（稍后会详细介绍），因此我创建了第一个工作来获取 Office 报价。

name: Dynamic README injection
on:
  schedule: # Run workflow automatically
    # This will make it run every hour
    - cron: "0 * * * *"
    # Run workflow manually (without waiting for the cron to be called), through the Github Actions Workflow page directly
jobs:
  get-office-quotes:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v2

      - name: Let the magic happen
        uses: actions/setup-node@v1
        with:
          node-version: 14.6.0

      - run: yarn

      - run: node .

      - name: Add to git repo
        run: |
          git config pull.rebase false
          git pull
          git add .
          git config --global user.name "Your Name"
          git config --global user.email "Your E-Mail"
          git commit -m "[Automated] README updated with new Office quote!"
      - name: Push
        uses: ad-m/github-push-action@master
        with:
          github_token: ${{ secrets.GITHUB_TOKEN }}

请注意，该作业node .在项目根目录下运行，导致index.js文件执行，获取引用，并将README.template.md文件中的所有内容复制到README.md文件中。这本身并不足以使更新后的信息显示在我的个人资料中。我需要提交并将更改推送到我的代码库，这就是我添加此Add to git repo步骤的原因。

现在该README.md文件包含 Office 报价和README.template.md文件中的所有其他内容，我可以运行最后的作业来获取我更新的博客文章（请记住，该README.md文件现在包含我们在上一篇文章中创建的静态博客文章模式）。

name: Dynamic README injection
on:
  schedule: # Run workflow automatically
    # This will make it run every hour
    - cron: "0 * * * *"

  workflow_dispatch:
jobs:
  get-office-quotes:
    # job steps
        ...

  update-readme-with-blog:
    needs: get-office-quotes
    name: Update this repo's README with latest blog posts
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v2
      - uses: gautamkrishnar/blog-post-workflow@master
        with:
          # Replace this URL with your rss feed URL/s
          feed_list: "https://braydoncoyer.hashnode.dev/rss.xml"

由于Gautam Krishna R 的GitHub Action 的工作方式，这项作业必须在我注入 Office 引言后运行——否则，它会覆盖README.md文件中的内容并删除引言。值得庆幸的是，GitHub Actions 有一个needs属性，我已将其添加到工作流中，以便它仅在get-office-quotes工作流完成其步骤后才会激活。

文件dynamic-injection-workflow.yml现已完成。我提交了更改并将其推送到我的 GitHub 配置文件存储库。

GitHub 识别出我添加了一个工作流程，并且我可以在“操作”>“所有工作流程”下看到它列出。