ブログを始めたいと思ったとき、今はたくさんの選択肢があります。
はてなブログや note といったアカウント登録だけで始められるサービスを使う方法以外にも、WordPress のようにサーバーを自分で用意しなければいけない代わりに、豊富なプラグインでカスタマイズが可能になるCMSを使うといった方法もあります。
最近はブログの体裁だけを用意して、中身は自分の好きなツールで書くヘッドレスCMSも増えてきています。とりわけ Notion を使ってブログを書く Notion Blog は、有料のサービスも提供されるなど流行を見せています。
有料サービスとして提供されるほど人気を博している Notion Blog ですが、お金を支払わなくても始められる（その分、知識や労力を必要としますが）ソフトウェアがOSS（オープンソースソフトウェア）として多く提供されています。
私が開発している easy-notion-blog も Notion Blog のOSSのひとつで、Super などの有料サービスほど簡単ではないものの ”無料の割には” 簡単に始められることが特徴です。詳しくは下記の記事をご覧ください。
Notion Blog のOSSには、easy-notion-blog よりも有名なものがあります。
この記事では、他の Notion Blog のOSSのうち現在最も人気のあるプロダクト2つ、Nobelium と vue-notion の特徴を、easy-notion-blog との比較を交えながら紹介します。
Nobelium は現時点で GitHub Star が 1,500も付いており、Star 数では1番人気のある Notion Blog です。
仕組みとしては、自分の Notion に作ったデータベースに書いた記事を、Vercel にホストした Next.js 製アプリケーションから取得して配信するというものです。
この点は本家の notion-blog や easy-notion-blog と同じですね。
Next.js on Vercel なので ISG にも対応しており、ページの表示が非常に速いことが特長です。
その他の特徴としては、Notion ブロックのレンダリングを react-notion-x に任せていること、CSS フレームワークとして TailwindCSS を使っていることでしょうか。
Notion ブロックのレンダリングは、easy-notion-blog では全てではないですがほぼ自前で行なっているという点で異なっています。
TailwindCSS は最近だと最も話題性のある CSS フレームワークのひとつで、、HTMLクラスごとにスタイルするのではなく、CSSプロパティごとに定義されたクラスを用いてスタイルするという思想を持ったCSSフレームワークです。
Twitter Bootstrap のスペーシングでは mt-3 や p-5 といったマージンやパディングのためだけのクラスが定義されていますが、その他多くのCSSプロパティ（角丸やフォントなど）にまで拡張したのが TailwindCSS だとイメージしてもらえばわかりやすいかと思います。
Nobelium のクイックスタートを見てみると、Notion データベースは自前で作らせるのではなく「コピーして使ってね」という指示があります。
この方法だとユーザーの言語環境に左右されることがなくなります。この点は easy-notion-blog にも取り入れたいですね。
一方、Notion API に関してはオフィシャルのものではなく、ブラウザからトークンを取得して使うことから非公開 API を使用しているようです。
README には「トークンは180日で切れるので手動で更新してね」との注意があります。
180日の猶予があるとは言え、更新を忘れるとブログが停止してしまうのは場合によってはリスクかもしれません。
その点、 easy-notion-blog はオフィシャルのAPIを使用しているためその心配はありません。
vue-notion は現時点で GitHub Star が 600ほど付いており、Nobelium に続いて2番目にStarが多い Notion Blog です。
名前からもわかるように、JavaScript のフレームワークとして Vue.js を採用しています。
vue-notion は Nobelium や easy-notion-blog のようにブログに特化したプロダクトというわけではなく、「Notion のページをホストでき、その一環としてブログも可能」という位置付けのようです。
また、どこにホストするかといった公開までのクイックスタートはなく、ある程度そのあたりの知識がある人向けのようです。
仕組みとしては、 notion-api-worker という非公開APIを叩いてくれる代理のAPIサーバーが https://notion-api.splitbee.io/ にホストされていて、Notion の公開ページであればここを通じて取得できるようです。
非公開ページを取得したい場合は、自身のAPIトークンを使って自身で notion-api-worker をホストする必要があります。
vue-notion （というより notion-api-worker）も非公開APIに依存していますが、Nobelium に比べると公開ページだけを取得する場合はトークンを自分で更新しなくて良いというメリットがあります。
しかし、公開ページだけを公開したいケースは Notion 自体の機能で事足りることからも、非公開ページを公開したいケースの方が多いでしょう。
その場合には自前で notion-api-worker をホストすることになり、それなりの労力がかかりそうです。当然、この場合にはトークンを自分で更新する必要があります。
easy-notion-blog では公式APIを使い、Vercel にホストすることを前提としているため、このあたりの悩みはありません。
人気の Notion Blog を紹介しつつ easy-notion-blog も宣伝しました。
こうやって比べてみると easy-notion-blog はなかなか良い線行ってそうだと自画自賛したくなる反面、人気の差に表れているように、細かいところでまだ足りない部分が多くありそうだとも思っています。
もし、easy-notion-blog に追加して欲しい機能や、こんなカスタマイズ方法が知りたいなどがあればぜひ GitHub Issues や Twitter コミュニティでお知らせください。
この記事を読んで「ちょっと easy-notion-blog 使ってみるか」と思っていただければ幸いです。
コメントを送る
コメントはブログオーナーのみ閲覧できます