imrok-notion is a Gatsby-based boilerplate that demonstrates how to build a static website using Notion as a headless content source, created as a proof of concept for the Astraliko Nebula site.
What is imrok-notion?
imrok-notion is a proof-of-concept project that integrates Gatsby with Notion. It reads content from a Notion database using a token and database ID supplied through environment variables, then generates a static site with Gatsby. The project's stated goals are to build the Astraliko Nebula website at nebula.rimarok.com and to create base logic and reusable components for a future gatsby-notion module abstraction. The repository is public and currently has zero stars.
Key Features
- Gatsby framework — Built on Gatsby, a React-based static site generator, and categorized under the JAMstack topic in the repository metadata.
- Notion as a CMS — Fetches content from a Notion database identified by
DATABASE_ID, authenticated withNOTION_TOKEN. - SCSS styling — The repository topics include Sass, indicating SCSS is used for styling components.
- GitHub Actions support — GitHub Actions is listed as a topic, suggesting CI/CD integration for automated builds or deployments.
- Static site output — Produces a static site that can be hosted on any static web host.
- Environment-based configuration — Uses a
.env.developmentfile withWEBSITE_TITLE,NOTION_TOKEN, andDATABASE_IDfor setup. - Local development — Start the dev server with the single command
npm start.
Who is it for?
- Developers exploring Gatsby and Notion integrations — Use this POC as a working reference for connecting a Notion database to a Gatsby site, with environment variable handling and local dev setup already in place.
- Website owners who want Notion as a content backend — Build a personal or project site like Astraliko Nebula where pages are driven by content stored in Notion and output as a fast static site.
- Open-source contributors interested in gatsby-notion abstractions — Study the base logic and components here as a foundation for a reusable module that other Gatsby sites could consume.
What can you do with imrok-notion?
- Launch a Notion-powered static site: Set up the environment variables, run
npm start, and develop a site whose content originates from a Notion database. - Learn the integration pattern: Inspect how the POC structures data fetching and rendering from Notion, which can inform your own Gatsby x Notion setup.
- Extend the starter for your own content: Use
WEBSITE_TITLEto set your site name and adapt the components to your content model.
How does imrok-notion work?
Create a .env.development file at the project root with the properties WEBSITE_TITLE, NOTION_TOKEN, and DATABASE_ID filled in. Then run npm start to start the local Gatsby development server and begin building the static site.
