![見出し画像](https://assets.st-note.com/production/uploads/images/57462508/rectangle_large_type_2_29b4ec2836ec52763f181f756ef76eec.jpg?width=1200)
(非エンジニア向け) notion-blog-nextjs で Notion をヘッドレス CMS にしたブログを開設する (Notion API)
こんにちは、円谷です。表題にもある通り、今日は notion-blog-nextjs という Notion をヘッドレス CMS にしたブログの紹介をしたいと思います。CMS が Notion で、フロントエンドが Next.js というアーキテクチャでブログを開設することができるというものです。
This is a Next.js blog using Notions Public API.
とのことで、Notion の公式 API を使った Next.js のテンプレートになります。実は、以前にも Notion を CMS にしたブログを作成する記事を書いたことがあったのですが、こちらの記事で紹介した方法は、Notion の非公式 API を使ってブログを作成する方法でした。
こちらはブラウザから取得するトークンを使って、非公式 API から情報を取得する都合上、ログイン・ログアウトしたりすることで、トークンが変わってしまい、(トークン切れ問題と呼んでいました)
今回紹介する notion-blog-nextjs は Notion の公式 API を使用するので、こちらのトークン切れ問題は起きなくなります。ということで、実際にブログを開設してみました👇
![Notion API でブログを作った](https://assets.st-note.com/img/1627127924612-TE93R7yQHf.png?width=1200)
開設したブログ https://notion-blog-official-api.vercel.app/
![画像2](https://assets.st-note.com/img/1627127988602-OxMchhBqjN.png?width=1200)
Notion 側のスクリーンショット
Next.js + Vercel というアーキテクチャなので、Notion 側で編集した内容が即座にブログに反映されます。(Notion のページも公開してます)
https://www.notion.so/35d/477632e49a074be19448be42e3d2ba0d?v=8bfd0fad7010459ca3a8e656fa9d7c22
ということで、本日のマガジンでは、この notion-blog-nextjs を使って
(非エンジニアの方でも)ブログが開設できるように解説していきたいと思います。
この記事が気に入ったらサポートをしてみませんか?