ポートフォリオを更新しました

ポートフォリオを１年ぶりに更新しました。以前のものは、next.jsをstatic site generatorとして利用していましたが、今回はAstroを利用して構築しました。 Astroでは、テンプレートが配布されているので、こちらを利用しました。

記事の更新に関して、CMSを利用しようかと考えましたが、Github Issueを利用して記事を管理できそうだったので実装してみました。

実装した内容

具体的には、Github Actionsを経由して、publishラベルが付与されたIssueを閉じると、記事が自動生成される仕組みを実装しました。 また、画像については、issue内でアップロードした画像を自動的にコミットして、記事内で利用できるようにしました。

ワークフローの内容は以下の通り。

name: Issue to Article

on:
  issues:
    types: [closed, labeled]

# 同時実行を抑止して、コミット衝突を避ける
concurrency:
  group: issue-to-article
  cancel-in-progress: false

permissions:
  contents: write
  issues: read

jobs:
  convert:
    # publishラベルが付いていて、Issueがcloseされている場合のみ実行
    if: |
      contains(github.event.issue.labels.*.name, 'publish') &&
      github.event.issue.state == 'closed' &&
      (github.event.issue.author_association == 'OWNER' ||
       github.event.issue.author_association == 'MEMBER' ||
       github.event.issue.author_association == 'COLLABORATOR')

    runs-on: ubuntu-latest

    steps:
      - name: Checkout repository
        uses: actions/checkout@v4
        with:
          fetch-depth: 1

      - name: Set up Python
        uses: actions/setup-python@v5
        with:
          python-version: '3.12'

      - name: Install dependencies
        run: pip install requests

      - name: Run conversion script
        env:
          ISSUE_NUMBER: ${{ github.event.issue.number }}
          ISSUE_TITLE: ${{ github.event.issue.title }}
          ISSUE_BODY: ${{ github.event.issue.body }}
          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
        run: python .github/scripts/issue_to_article.py

      - name: Commit and push changes
        run: |
          git config user.name "github-actions[bot]"
          git config user.email "github-actions[bot]@users.noreply.github.com"
          git add src/content/articles/ public/images/articles/
          if git diff --staged --quiet; then
            echo "No changes to commit"
          else
            git commit -m "Add/Update article from issue #${{ github.event.issue.number }}"
            git push
          fi

こんな感じで、workflow内でpythonスクリプトを実行して、記事の生成と画像のダウンロードを行っています。

わざわざCMSを導入しなくても、Github Issueを利用して記事管理ができるので、スマホからでも投稿できるので便利になるはず。