Skip to content

Commit

Permalink
Update to provide blog index through env also
Browse files Browse the repository at this point in the history
  • Loading branch information
ijjk committed Jan 5, 2020
1 parent 815fce0 commit 43e6a8e
Show file tree
Hide file tree
Showing 4 changed files with 42 additions and 21 deletions.
24 changes: 21 additions & 3 deletions next.config.js
@@ -1,8 +1,26 @@
if (!process.env.NOTION_TOKEN) {
const { NODE_ENV, NOTION_TOKEN, BLOG_INDEX_ID } = process.env

const warnOrError =
NODE_ENV !== 'production'
? console.warn
: msg => {
throw new Error(msg)
}

if (!NOTION_TOKEN) {
// We aren't able to build or serve images from Notion without the
// NOTION_TOKEN being populated
warnOrError(
`\nNOTION_TOKEN is missing from env, this will result in an error\n` +
`Make sure to provide one before starting Next.js`
)
}

if (!BLOG_INDEX_ID) {
// We aren't able to build or serve images from Notion without the
// NOTION_TOKEN being populated
throw new Error(
`NOTION_TOKEN is missing from env, this will result in an error\n` +
warnOrError(
`\nBLOG_INDEX_ID is missing from env, this will result in an error\n` +
`Make sure to provide one before starting Next.js`
)
}
Expand Down
6 changes: 4 additions & 2 deletions now.json
@@ -1,10 +1,12 @@
{
"build": {
"env": {
"NOTION_TOKEN": "@notion-token"
"NOTION_TOKEN": "@notion-token",
"BLOG_INDEX_ID": "@blog-index-id"
}
},
"env": {
"NOTION_TOKEN": "@notion-token"
"NOTION_TOKEN": "@notion-token",
"BLOG_INDEX_ID": "@blog-index-id"
}
}
31 changes: 16 additions & 15 deletions readme.md
Expand Up @@ -6,19 +6,6 @@ This is an example Next.js project that shows Next.js' upcoming SSG (static-site

**Live Example hosted on ZEIT**: https://notion-blog.jj4.now.sh/

## Deploy Your Own

Deploy your own Notion blog with ZEIT.

[![Deploy with ZEIT Now](https://zeit.co/button)](https://zeit.co/new/project?template=https://github.com/ijjk/notion-blog/tree/master)

or

1. Clone this repo `git clone https://github.com/ijjk/notion-blog.git`
2. Update `BLOG_INDEX_ID` in [`./src/lib/notion/server-constants.ts`](./src/lib/notion/server-constants.ts) with your id. See [here](#getting-blog-index) for how to find this value.
3. Add your `NOTION_TOKEN` as a secret to Now `now secrets add notion-token <your-token>`
4. Deploy with `now`

## Creating your pages table

To create your pages table you need to create a new page in Notion and add a table to that page.
Expand All @@ -33,18 +20,32 @@ The table should have the following properties:

![Example Blog Posts Table](assets/table-view.png)

## Getting Blog Index
## Getting Blog Index and Token

To get your blog index value, open Notion and Navigate to the Notion page with the table you created above. While on this page you should be able to get the page id from either:

- the URL, if the URL of your page is https://www.notion.so/Blog-S5qv1QbUzM1wxm3H3SZRQkupi7XjXTul then your `BLOG_INDEX_ID` is `S5qv1QbU-zM1w-xm3H-3SZR-Qkupi7XjXTul`
- the `loadPageChunk` request, if you open your developer console and go to the network tab then reload the page you should see a request for `loadPageChunk` and in the request payload you should see a `pageId` and that is your `BLOG_INDEX_ID`

To get your Notion token, open Notion and look for the `token_v2` cookie.

## Deploy Your Own

Deploy your own Notion blog with ZEIT.

[![Deploy with ZEIT Now](https://zeit.co/button)](https://zeit.co/new/project?template=https://github.com/ijjk/notion-blog/tree/master)

or

1. Clone this repo `git clone https://github.com/ijjk/notion-blog.git`
2. Add your `NOTION_TOKEN` and `BLOG_INDEX_ID` as a secret to Now `now secrets add notion-token <token> && now secrets add blog-index-id <blog-index>`. See [here](#getting-blog-index) for how to find these values
3. Deploy with `now`

## Running locally

To run the project locally you need to follow steps 1 and 2 of [deploying](#deploy-your-own) and then follow the below steps

1. Install dependencies `yarn`
2. Expose `NOTION_TOKEN` in your environment `export NOTION_TOKEN='<your-token>'` or `set NOTION_TOKEN='<your-token>' on windows
2. Expose `NOTION_TOKEN` and `BLOG_INDEX_ID` in your environment `export NOTION_TOKEN='<your-token>'`and `export BLOG_INDEX_ID='<your-blog-index-id>'`
3. Run next in development mode `yarn dev`
4. Build and run in production mode `yarn build && yarn start`
2 changes: 1 addition & 1 deletion src/lib/notion/server-constants.ts
@@ -1,3 +1,3 @@
export const NOTION_TOKEN = process.env.NOTION_TOKEN
export const BLOG_INDEX_ID = process.env.BLOG_INDEX_ID
export const API_ENDPOINT = 'https://www.notion.so/api/v3'
export const BLOG_INDEX_ID = 'f8552190-ae27-4227-a36c-68dd7c9863b5'

1 comment on commit 43e6a8e

@vercel
Copy link

@vercel vercel bot commented on 43e6a8e Jan 5, 2020

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Deployment failed with the following error:

Could not find a secret by name "blog-index-id"

Please sign in to comment.