yokinist.me

A static blog build on top of Notion and Nextjs, deployed on Vercel.

This repo is customized based on craigary/nobelium.

Highlights ✨

🚀 Fast and responsive

Fast page render and responsive design
Fast static generation with efficient compiler

🤖 Deploy instantly

Deploy on Vercel in minutes
Incremental regeneration and no need to redeploy after update the content in notion

🚙 Fully functional

Full width page, quick search and tag filter
RSS, analytics, web vital... and much more

🎨 Easy for customization

Rich config options, support English & Chinese interface
Built with Tailwind CSS, easy for customization

🕸 Pretty URLs and SEO friendly

The sitemap will be updated every your build

💚 Type Safety

The source code is written in TypeScript

Quick Start

Star this repo 😉

Duplicate this Notion template, and share it to the public

Fork this project
Customize blog.config.js
(Optional) You can customize tags in lib/tags.ts to match those in your Notion database.
(Optional) You can add animation to your profile by specifying the profile image block class in style/notion.css

How to check the block class？

(Optional) Replace favicon.svg, and favicon.ico in /public folder with your own
(Optional) You can set redirect custom link to /link page in blog.config.js
Deploy on Vercel, set following environment variables：
- NOTION_PAGE_ID (Required): The ID of the Notion page you previously shared to the web, usually has 32 digits after your workspace address
That's it! Easy-peasy?

Wait for a sec, what is Page ID？

Getting started in developing

Once you have set the environment variables in the Vercel dashboard, run the following
- vercel env pull (with Vercel CLI)
- or cp .env.sample .env.local and insert YOUR_NOTION_PAGE_ID

Play With Docker

Unofficial, thanks to @Vaayne's work!

# set env
export NOTION_PAGE_ID=xxx # your NOTION_PAGE_ID
export IMAGE=nobelium:latest

# build with docker
docker build -t ${IMAGE} --build-arg NOTION_PAGE_ID .

# run with docker
docker run -d --name nobelium -p 3000:3000 -e NOTION_PAGE_ID=${NOTION_PAGE_ID} nobelium:latest