Notion Blog Web UI Starter

A statically generated blog using Next.js, notion-sdk-js.

Live Demo

Magagin	Archive	Article

Star this repo⭐️
Create notion integrations secret token, Please check read only access and remember secret token.
Go to the page you want to share and connection to the name of the integration
Deploy with Vercel or Your server (Vercel is free if a hobby.)
Create /.env file and according to the table below (Deploy with Vercel has already been set above.)

Create /.env file and according to the table below or refrence /.env.example

Required Keys	Value
`NOTION_API_SECRET_KEY`	Create notion integration `secret token` please check read only access ex) `secret_zhL...`
`NEXT_PUBLIC_NOTION_DATABASE_ID`	ex) `cd9c83dd...`
`NEXT_PUBLIC_INFOMATION_BLOGNAME`	ex) `soolog`
`NEXT_PUBLIC_INFOMATION_ORIGIN`	ex) `https://example.com`

The comment feature. Please set only one of Giscus or Utterances.

Giscus	Value
`NEXT_PUBLIC_GISCUS_REPOSITORY`	Giscus Repository ex) `username/repository`
`NEXT_PUBLIC_GISCUS_REPOSITORY_ID`	Giscus Repository ID ex) `R_kgDO.....`
`NEXT_PUBLIC_GISCUS_CATEGORY`	Giscus Category ex) `General`
`NEXT_PUBLIC_GISCUS_CATEGORY_ID`	Giscus Category ID ex) `DIC_kwDO.........`

Utterances	Value
`NEXT_PUBLIC_UTTERANCES_REPOSITORY`	Utterances Repository ex) `username/repository`
`NEXT_PUBLIC_UTTERANCES_LABEL`	Utterances Issue Label ex) `comments`

Optional	Value
`NEXT_PUBLIC_INFOMATION_EMAIL`	ex) `contact@sooros.com`
`NEXT_PUBLIC_INFOMATION_GITHUB`	ex) `https://github.com/sooros5132`
`NEXT_PUBLIC_INFOMATION_REPOSITORY`	ex) `https://github.com/sooros5132/notion-blog-kit`
`NEXT_PUBLIC_NOTION_CUSTOM_DOMAIN`	Recommend setting this variable. Notion app -> Settings -> Public settings -> Domain ex) `sooros`
`NEXT_PUBLIC_GOOGLE_ANALYTICS_ID`	Google Stream ID(Google Analytics ID) ex) `G-EH6A2.....`
`NEXT_PUBLIC_ENABLE_IMAGE_OPTIMIZATION`	This function has the effect of being reflected in the Google search ranking. For fast processing, this feature requires server performance as high as Intel Pentium. ex) `true`

Name		Name	Last commit message	Last commit date
Latest commit History 386 Commits
public		public
src		src
.env.example		.env.example
.eslintrc.json		.eslintrc.json
.gitignore		.gitignore
.prettierrc.json		.prettierrc.json
README.md		README.md
components.json		components.json
next-env.d.ts		next-env.d.ts
next.config.js		next.config.js
package-lock.json		package-lock.json
package.json		package.json
postcss.config.js		postcss.config.js
tailwind.config.js		tailwind.config.js
tsconfig.json		tsconfig.json