てなわけで、nextjs-notion-starter-kitを使ったブログの構築です。
まあ技術的なことはわかりませんが、公式APIを使った方法を採用しているそうです。
notion-blogより安定していてよいと思います。
（問題点については後程）
準備
まずは、Notionでブログに使う用のデータベースを作ります。
例にもある通り、ギャラリービューを使う必要があるみたいです。
オプションとしてはこんな感じです（名前は任意のもの）。
- タイトル ：記事タイトルを設定します
- 説明：記事の説明、概要
- 公開設定：チェックボックスで設定します、これをフィルターに追加して公開を制御します
- タグ：まあ、タグです
- 作成日時：あるといいね
- 進捗：私は進捗管理したいので専用のタグをつけて、ボードで管理しています
必要に応じて表示非表示切り替えですね、非表示にすれば公開側で存在すら隠せてました。
で、共有から公開にします。
（アクセスキーを使わずにAPIを叩くからでしょう）
続いてリポジトリにアクセスしてフォークなり、クローンなりします。
私はとりあえず今のところ変更しないで試すだけなので、WSL2上にcloneしました。
site.config.js このファイルを修正して設定します。
先ほど設定したデータベースのIDを取ってきて設定。
あとは見た感じで何となく入れます、いらないところはnullにしました。
デプロイはVercelを使うので、そちらでアカウント登録を済ませておきます。
デプロイ
そして一連の流れ。
npm install -g vercel #Vercel初回の場合 npm install npm run dev #現在devで確認はできません、エラーが出ます。Issueにも載ってました・・ npm run deploy #Vercelにデプロイします
Vercelを使うのが初回の場合はログインやらなにやら色々聞かれます。
何となくで行けるのでなんとなくで。
これで、Vercelのダッシュボード見るとデプロイしたものが存在するはずです。
あとは、独自ドメインを設定するなりするといいみたい。
気になるところ
記事タイトルの話
Notionの仕様のせいなのか、作りこみのせいなのか、
記事のタイトルに日本語と英語が混在していると高確率で記事が見れなくなります。
URIにPageIDを使うのか、タイトルを使うのか処理を分けているのか何なのか
個人的にはPageID使ってくれればいいので、一律そうする設定とか入れてくれると嬉しい。
非対応ブロック
全部試していませんが、もしかしたら非対応ブロックなどがあるかもしれません。
文字の背景色とかそのあたりも設定しても適用されないので、対応してほしいなと思ったり・・
最後に
とまあ、こんな感じで公開できます。
見た目的にはNotionでそのまま公開してもいいかなと思ったりもしますが、
これを使うと例えばギャラリービュー以外にも、固定のページを用意したりとか、
SSO周りもやってくれるのかな？（わからん）
CSSいじれる人はそれで色々作れますし、かなり良さそうです。
個人的には記事タイトルの件がかなり面倒なので、これを今後も使っていくかはわかりませんが、
とりあえず色々試していこうと思います。
Vercelも今回初めて知ったんですが、色々やっても無料で出来ますし、独自ドメインまで設定できるのでかなり良いです。
Lemmyとの使い分けとか考えながらやっていこうと思います。
では、また。