【Mac x Hugo x GitHub Actions】SSGで今までの勉強会を記録していくスタイル　😅😅😅

yochan

背景🗻🗻🗻

今回Hugoを使ってWiki代りのページを作成・公開します。
今までVuePressの経験等はあったのですが、Hugoで構築したことがなかったので試してみたくなった次第です。😅😅😅

Hugoをインストール

brew install hugo
hugo -h

ディレクトリ等を作成

hugo new site . --force
.
├── archetypes
│   └── default.md
├── config.toml
├── content
├── data
├── layouts
├── static
└── themes

テーマを選ぶ

Theme

# <theme>の部分をGitHubに合わせて設定してください
# ex:
# theme: [https://github.com/theNewDynamic/gohugo-theme-ananke:title]
# git submodule add https://github.com/theNewDynamic/gohugo-theme-ananke.git themes/gohugo-theme-ananke

git init
git submodule add https://github.com/<user_name?>/<theme>/git themes/<theme>

exampleSite/からコピーする

cp -r ./themes/<theme>/exampleSite/* ./

config.tomlをテーマごとにカスタマイズ

がんばりましょうwww

Github Actions

gh-pages.ymlを作る

mkdir .github
mkdir .github/workflows
touch gh-pages.yml

gh-pages.ymlの中身

参考

# [https://qiita.com/peaceiris/items/d401f2e5724fdcb0759d]
name: GitHub Pages

on:
  push:
    branches:
      - main  # Set a branch name to trigger deployment
  pull_request:

jobs:
  deploy:
    runs-on: ubuntu-20.04
    concurrency:
      group: ${{ github.workflow }}-${{ github.ref }}
    steps:
      - uses: actions/checkout@v2
        with:
          submodules: true  # Fetch Hugo themes (true OR recursive)
          fetch-depth: 0    # Fetch all history for .GitInfo and .Lastmod

      - name: Setup Hugo
        uses: peaceiris/actions-hugo@v2
        with:
          hugo-version: '0.85.0'

      - name: Build
        run: hugo --minify

      - name: Deploy
        uses: peaceiris/actions-gh-pages@v3
        if: ${{ github.ref == 'refs/heads/main' }}
        with:
          github_token: ${{ secrets.GITHUB_TOKEN }}
          publish_dir: ./public

成果物🍓

GitHub


この記事が気に入ったらサポートをしてみませんか？