This is a demo website that uses Notion.so as a backend for Gatsby. This is possible using gatsby-source-notion-api plugin that works with official public Notion API.

Check out the README on GitHub for the latest information on how to use the package.

The styling of this demo site is done with TailwindCSS with 0 lines of CSS code written.

Thanks to simple and convenient API provided by MarkdownRemark and MDX, you can query Notion pages with mardownRemark or mdx if you use them. For your convenience, all Notion page properties are put into frontmatter.

Here is the list of pages coming from Notion:

Caveats

Currently Notion API returns many blocks with a type of unsupported. They will hopefully become available later on. For now, gatsby-source-notion-api marks places for these blocks with an HTML comment. All attachment blocks are not supported. Unfortunately, it also includes images.

Gatsby + Notion = ♥️

Here is the list of pages coming from Notion:

Caveats

Additional Resources