Notion Blog Nextjs Save

Next.js example blog powered by Notion Public API

Project README

This is a Next.js blog using Notions Public API.

Demo: https://notion-blog-nextjs-coral.vercel.app

How-it-works/Documentation: https://samuelkraft.com/blog/building-a-notion-blog-with-public-api

Getting Started

First, follow Notions getting started guide to get a NOTION_TOKEN and a NOTION_DATABASE_ID, then add them to a file called .env.local.

As a reference here's the Notion table I am using: https://www.notion.so/5b53abc87b284beab0c169c9fb695b4d?v=e4ed5b1a8f2e4e12b6d1ef68fa66e518

NOTION_TOKEN=
NOTION_DATABASE_ID=

Install dependencies

npm install
# or
yarn

Start the server with

npm run dev
# or
yarn dev

Open http://localhost:3000 with your browser to see the result.

Deploy to vercel

Deploy with Vercel

GitHub Actions

  • Deployment workflows are located under .github/workflows/ in this repository.
  • To use the actions, rename them to remove the .txt extensions

To be able to deploy on both vercel and gh pages through GitHub actions when merging/pushing to master, add the following as your GitHub Action Secrets (Settings->Secrets->Actions).

  1. ORG_ID - Vercel account ID found in account Settings.
  2. PROJECT_ID - Vercel project ID found in project Settings.
  3. VERCEL_TOKEN - Vercel token created in Settings -> Tokens.
  4. GH_TOKEN - GitHub token usually readily available for each account (optional).
Open Source Agenda is not affiliated with "Notion Blog Nextjs" Project. README Source: samuelkraft/notion-blog-nextjs
Stars
948
Open Issues
3
Last Commit
3 months ago
License
MIT

Open Source Agenda Badge

Open Source Agenda Rating