• Introduction
• Demo
• Features
• Major Dependencies
• Getting Started
• Screenshots
• TODO

This is a blog template that uses Notion as CMS.
Upload posts in Notion, share them through your blog!
This project uses App Router that is now stable in Next.js 13.4.

Check out the demo site HERE

https://www.youtube.com/watch?v=rZgh8a4ZjA8

• Simple to sync Notion and blog
• Search posts by name
• Filter posts by categories
• Related posts
• Dark mode
• Responsive design
• Sitemap

• react-notion-x: Renderer for notion pages
• notion-client: Unofficial Notion API which is much faster than official Notion API

1. Duplicate this notion blog template to your notion workspace. (Make your notion page public.)

   

2. Visit your notion page with browser.

3. Check your database id in the url. (needed as an environment variable)

   

4. Check your auth token in the cookie. (needed as an environment variable)

   

5. Now you can run on local or deploy to Vercel with environment variables listed below.

Slug should be unique because it's used as url of the post page

NOTION_DATABASE_ID: getting started step 3
NOTION_AUTH_TOKEN: getting started step 4
SITE_URL: URL of your site (http://localhost:3000 in local environment)
API_KEY: Choose your own password for route handler

• Light mode for code block