NotionをヘッドレスCMSとして、Next(13)でブログ作成し、Github Pagesに公開したときにつまづいた所

NotionをヘッドレスCMSとして、Next(13)でブログ作成し、Github Pagesに公開したときにつまづいた所

元ネタはこちらです。
これをアレンジしてブログを作りました。
Githubでも公開しています。

元ネタではHostingサービスにVercelをしていますが、今回は以前から使ってみたかったGithub Pagesを使いました。
GitHub PageとNext.jsで静的ページを構築を参考にしました。
この記事ではその方法などについては触れませんが、Github Pagesを使ったことによってつまづいた箇所が多々あったので、前置きとしてお話ししました。

環境変数の設定が必要

GitHubのActionsの設定をすると、変更分をpushするとbuild→deployしてくれます。
今回はbuid時にエラーが発生してうまくいきませんでした。

APIResponseError: API token is invalid.
API Response Error: Invalid request URL - dvanoni/notero

どちらも環境変数を読み取れなくてエラーになっていました。
リポジトリ > Setting > Environments > Configure > github-pagesで環境変数を設定していましたが、それが良くなかった？？

環境変数ではなく、リポジトリ変数に入れたらbuildできました。
リポジトリ > Setting > Secrets and variables > ActionsのSecretsタブで「New repository secret」から追加します。

Github Pagesに公開した時に、readme.mdが表示される

いざGithub Pagesにdeployすると、思った通りの表示にならず、readme.mdの内容が表示されてしまいました。
index.htmlが存在してもreadme.mdが優先されて表示されちゃうらしいです。

readme.mdを移動しよう！

readme.mdを.githubディレクトリに移動したら解決します。

まとめ

環境変数苦手です！