Hugo静的ブログを構築する（デプロイ編）

1. 準備作業#

Github
Vercel(オプション)

2. リポジトリと環境の作成#

GitHub で新しいリポジトリを作成
- 名前：yourusername.github.com
TOKEN の作成
- アカウント - 設定 - 開発設定 - 個人アクセストークン
- 有効期限を「永遠」に設定
- repoとworkflowにチェックを入れる
Token をリポジトリにリンク
- リポジトリを開く - 設定
- 新しいキーを作成。名前は TOKEN

3. ローカルでのワークフロー作成#

your-blog-site ディレクトリ内に.github/workflows/hugo_de.yamlを順に作成

name: deploy

# コードがmainブランチにプッシュされたときにgithub actionをトリガー
on:
  push:
    branches:
      - dev

jobs:
  deploy:
    runs-on: ubuntu-latest
    steps:
        - name: Checkout
          uses: actions/checkout@v4
          with:
              fetch-depth: 0

        - name: Setup Hugo
          uses: peaceiris/actions-hugo@v3
          with:
              hugo-version: "latest"
              extended: true

        - name: Build Web
          run: hugo -D

        - name: Deploy Web
          uses: peaceiris/actions-gh-pages@v4
          with:
              PERSONAL_TOKEN: ${{ secrets.TOKEN }} #TOKENは先ほどリポジトリ内で作成した名前を記入
              EXTERNAL_REPOSITORY: your-username/your-repository-name
              PUBLISH_BRANCH: main
              PUBLISH_DIR: ./public
              commit_message: auto deploy

この自動プログラムは、あなたのローカルで未デプロイのファイルを dev ブランチに公開し、その後 Action が自動的に main ブランチにデプロイします

4. GitHub へのデプロイ#

ルートディレクトリで入力：

git init
git add .
git commit -m "update"
git branch -M dev
git remote add origin https://github.com/your-username/your-repository-name.git
git push -u origin dev

GitHub Pages の設定
- リポジトリ - 設定 - 一般 - デフォルトブランチ：main
- リポジトリ - 設定 - ページ - ブランチからデプロイ：main