Skip to content

A proof of concept for a blog using Next.js and the new Notion API. ✨

Notifications You must be signed in to change notification settings

Dueen/notion-nextjs-blog

 
 

Repository files navigation

A proof of concept for a blog using Next.js and the new Notion API. ✨

How it works:

  1. Blog posts are stored as Notion pages in a database (full page table).
  2. A Notion integration generates a token to authorize access to the database.
  3. A client is initialized using the Notion SDK.
  4. For this specific example, only pages marked as published in the table properties are fetched using the API's filter param.
  5. getStaticProps() uses incremental static regeneration to update pages in the background (more info).
  6. Dynamic pages are generated using Notion's page ids.

Considerations:

  • The Notion API currently only supports text blocks and these need to be fetched separetely from pages.
  • Text blocks are returned as strings and need to be styled with CSS to recreate the rich text format.
  • Currently there is no support for custom post URLs as you can only query posts by id.

To dos:

  • Add support for nested blocks.
  • Format dates.
  • Sort posts by published date.
  • Figure out how create custom slugs. 🐌

About

A proof of concept for a blog using Next.js and the new Notion API. ✨

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 100.0%