top

Cartesian Theater

Powered by NotionAPI

20210724

Date: 2021-07-24
Last Edited: 2022-02-23 09:04:00

Notionに書いたものを日記として公開できたらステキな気がする。アプリのUIがよくて入力がスムーズだし、書いたものを構造化データとして置いておける。

というわけでNotion APIをCMSとして使ってNext.jsでフロントエンドを作ってみたのがこのサイトです。

リポジトリ↓

特に技術的に面白いところはないけど、Next.jsのSSG/ISRを活用している。インフラはVercel。あとスタイルにはTailwind CSS。

記事につけたYYYY-MM-DDの情報から年/月/日の階層にしたインデックス(PCだと画面左のやつ)を作るのが地味に難しかった。そんな大したことでもないのに…。

Notionで記事の親になっているテーブルの列にpublishedというチェックボックスをつけておき、そこがtrueのものだけ表示するようにすれば公開管理が簡単にできて便利。

本格的なブログをつけるならタグとかも付けておけそう。

ただしNotion APIはまだまだベータ版で全然機能が足りないのでそこまで複雑なブログは実装できない。(このサイトみたいにシンプルな日記くらいがちょうどいい)

以下ToDo

ヘッダー画像をUnsplashで作ったコレクションからランダム表示させようと思ってたけどできない。なんでだろう?https://source.unsplash.com/collection/{COLLECTION ID}を叩けばランダムで画像が返ってくるって書いてあるんだけどなぁ。

URLはフロントの側でいい感じの埋め込み表示を実装できるといい気がする。

OGPの自動生成などもできるとおしゃれになりそう。(結構大変そうだけど)

©︎2021 Yuki Oshima