Building a blog using Notion as the backend

ブログのバックエンドを Notion に変更した。Next.js on Cloud Run x Notion の構成。モチベーションと参考にしたソースなどについてのまとめ。

モチベーション

記事を書いてアップロードするのがなにかとめんどくさかった。以前の構成だと、記事を公開するまでのステップは以下の順番だった。

1. ブログ記事の下書きをなにかでする
2. WordPress 上で記事を仕上げる
3. UI を確認する
4. 公開する

この下書き工程がまずめんどうだった。markdown で書いておくものの、WordPress で仕上げる際になんだかうまくいかないことが多く、さらに WordPress で仕上げるという工程そのものがめんどうだった。なんとなくWordPress がデファクトだしおもしろそうだしやってみるかと作っている間はよかったけれど運用するのはライトユーザー的にはだいぶめんどうだった。

Frontity も framework だったのでカスタマイズするときになかなかタフだったし、特にコードを載せたときの Syntax highliting がうまくいかなくて苦しかった。そして Frontity が WordPress の親会社の Automatic に買収されたりしたのでちょっと使い続けるのしんどいなと思い、なかなかアプリを修正することや記事を書くことから遠ざかっていた。そんな中、いくつか Next.js のアプリケーションを作っていたところでこちらのテンプレートを見て、なるほど Notion な、とこれならバックエンドに Cloud SQL とかいらんし普通に Notion でまとめを書いておけばそのままブログにできそうだと思い、やってみた。

参考にしたもの

できたこと

基本的なブログのインデックスページや記事のページを Nextjs で作ることができた。元ネタが Nextjs11 だったので、Nextjs13 で作っていく上で何かとトラブルがあったり、スタイリングがおかしくなったり TypeScript が元気にエラーを出力してくれたりしたものの、一通りできたと思う。