Getting Started With NotionPress: Build Your First Notion-Powered Blog
A practical introduction to NotionPress, including the setup flow from GitHub and Notion to Astro and Cloudflare Pages.
NotionPress is a lightweight blog starter that lets you write articles in Notion and publish them as a fast website.
The basic idea is simple:
Notion
↓
Notion API
↓
GitHub sync
↓
Astro
↓
Cloudflare Pages
↓
Your website
You do not need to manage a traditional database or a complicated CMS. Your Notion database acts as the editorial workspace, while Astro turns the published content into a website.
1. Create your GitHub repository
Start by creating your own copy of the NotionPress repository.
On GitHub, open the NotionPress repository and select Use this template.
Create a new repository under your GitHub account or organisation.
Once created, you have your own independent copy of the starter.
2. Create your Notion CMS
Duplicate the NotionPress CMS template into your Notion workspace.
The CMS contains a Stories database. Each row represents an article.
The important fields are:
The article itself is written inside the Notion page.
3. Connect Notion to the project
Create a Notion integration and give it access to your Stories database.
The integration needs permission to read the database and its article pages.
Copy the integration token and keep it private.
You will also need the database or data source ID used by your NotionPress setup.
4. Configure environment variables
NotionPress uses environment variables rather than hard-coding private credentials.
A typical local configuration looks like:
NOTION_TOKEN=your_notion_token
NOTION_DATABASE_ID=your_database_id
PUBLIC_GA4_ID=G-XXXXXXXXXX
Only add the GA4 variable if you want analytics.
Never commit your Notion token to GitHub.
5. Install the project
Clone your repository and install its dependencies.
Then run the Notion sync:
npm run sync:notion
The sync script reads your published and draft stories from Notion and generates the local content used by Astro.
Start the development server:
npm run dev
Open the local address shown by Astro.
6. Publish your first article
Create a story in the Notion database.
Fill in the required properties and write the article in the page body.
For the first test, keep the article simple.
Set:
-
Status: Published
-
Title: your article title
-
Slug: a clean URL slug
-
Published Date: today’s date
-
Category: a suitable category
-
Author: your author
-
Description: a short summary
-
Tags: relevant topics
Run the sync again.
Your article should now appear in the generated website.
7. Deploy to Cloudflare Pages
Connect the GitHub repository to Cloudflare Pages.
Use Astro’s normal production build:
npm run build
Set the output directory to:
dist
Your GitHub sync workflow can update the content repository, after which Cloudflare Pages rebuilds the site.
8. The important mental model
NotionPress is not a live Notion-to-website renderer.
Your website is generated from synced content.
That means changing an article in Notion does not instantly change the live website. The content must first be synchronised, committed to GitHub and built by Astro.
This approach keeps the public site fast and simple.
9. What you should customise first
After the first successful deployment, customise these areas:
-
Site name and description
-
Website URL
-
Navigation
-
Colours
-
Typography
-
Analytics
-
ads.txt
-
Categories and tags
-
Sample content
Keep the first deployment close to the default. Make sure the publishing pipeline works before making major design changes.
10. Your first successful workflow
Once everything is connected, publishing becomes straightforward:
Write in Notion
↓
Set Status to Published
↓
Sync to GitHub
↓
Astro builds the site
↓
Cloudflare Pages deploys
↓
Article is live
That is the core NotionPress workflow.