本網站最近的更新項目

前言

最近做了許多大更新，果然還是有一個自己的主題 (theme) 比較自由，但是缺點就是會一直改來改去，似乎沒有盡頭。

~~哎呀，昨天 20211202 沒發到文。~~

寫完發現太長了，所以右邊有開啟 toc。

Auto deploy from the private repo

Private repo

本網站已經從原先開源發文內容的方式改為把該 repo 設定為私人，主要原因是為了防止別人輕易拿到原始內容進而能夠輕鬆盜取。先前我也已經檢舉了一堆內容農場，雖然防不勝防，不過我看到有些討論是建議把原始內容隱藏起來。再來私人模式下我也比較能夠控制一些內容何時可以公開發佈，這大概可以適用在鐵人賽預先囤文 (雖然我還不知道會不會參加)。原先舊的因為星星數頗多，所以維持公開並改為純記錄 issue (發文靈感)。

GitHub Action

此外，為了發文方便性，佈署方式已經從原先在本地端編譯好網站再推上去改為利用 GitHub Action。也就是我只要將內容更新推上 private repo，則 GitHub 那邊會自動幫忙編譯及推到目標 repo。因此整理一下，為了這個網站我現在有4個 repo：

aben20807/hugOuO：主題
aben20807/blog-post (private)：發文內容
aben20807/blog-post-issues：記錄靈感，~~收集星星~~
aben20807/aben20807.github.io：渲染成此網站的目標 repo

為了使用 GitHub Action 完成自動佈署，我用了以下工具：

peaceiris/actions-hugo：用於使用 hugo 編譯網站
cpina/github-action-push-to-another-repository-directory：因為我的內容跟渲染 repo 分離，所以需要這個工具推到另外一個 repo，需要按照教學申請 API_TOKEN_GITHUB
nektos/act：用於本地端測試 yaml 可不可以動

另外有一些小技巧會用到：

set-output: https://stackoverflow.com/a/65616499
Multiple lines for git message in yaml: https://stackoverflow.com/a/5064653

完整 blog-post/.github/workflows/deploy.yml 內容

name: Deploy

on:
  push:
    branches:
      - master

jobs:
  deploy:
    runs-on: ubuntu-latest
    concurrency:
      group: ${{ github.workflow }}-${{ github.ref }}
    steps:
      - name: Dump GitHub context
        env:
          GITHUB_CONTEXT: ${{ toJson(github) }}
        run: echo "$GITHUB_CONTEXT"

      - uses: actions/checkout@v3
        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.98.0'
          extended: true

      - name: Build
        run: hugo --gc --minify --cleanDestinationDir

      - name: Copy README.md
        run: cp README_web.md public/README.md

      - name: Retrieve commit message
        run: | # https://trstringer.com/github-actions-multiline-strings/
          CMT_MSG=$(cat << EOF
          Deploy site `date '+%Y-%m-%d %H:%M:%S'`

          by `hugo version` and Ubuntu `lsb_release -rs` (`uname -r`)
          from ORIGIN_COMMIT
          EOF
          )
          echo "CMT_MSG<<EOF" >> $GITHUB_ENV
          echo "$CMT_MSG" >> $GITHUB_ENV
          echo "EOF" >> $GITHUB_ENV
        id: message

      - name: Deploy
        uses: cpina/github-action-push-to-another-repository@main
        env:
          API_TOKEN_GITHUB: ${{ secrets.API_TOKEN_GITHUB }}
        with:
          source-directory: 'public'
          destination-github-username: 'aben20807'
          destination-repository-name: 'aben20807.github.io'
          commit-message: ${{ env.CMT_MSG }}
          user-email: aben20807@gmail.com
          target-branch: master

Dark mode

最近流行深色模式，主要可能是因為 OLED 螢幕比較省電，另外是可以減低藍光對眼睛的傷害。原先我打算跳槽到其他炫炮主題 (e.g., LoveIt)，不過後來查到深色模式可能沒有很複雜，所以就自己用了。我直接從 SWITCHING OFF THE LIGHTS PART TWO - ADDING DARK MODE TO HUGO 複製過來，比較麻煩的是 CSS 的控制。因為我原先都是手動硬改，所以這裡也需要比較多功 (細節可以去主題 repo 看)。不過算是有完成，最右上角有一個切換的按鈕，也是因為這次機會我才知道原來有 localStorage 可以用。