Overview:
This is an open-source starter blog template that combines Next.js, Notion, and Tailwind CSS. It is a statically generated blog template that allows for easy content creation and customization.
Features:
- Statically generated with Next.js
- Content powered by Notion
- Styled with Tailwind CSS
- Personalized page meta data
- Customizable blog posts with headline, URL slug, date, and description
- Optional cover image for posts on the frontpage and social media
- Integration with Notion for easy content management
Installation:
- Clone this repository:
git clone https://github.com/luciovilla/notion-nextjs-blog.git
- Install the necessary dependencies:
npm install
- Copy or rename the
.env.example
file to.env.local
- Personalize the page meta data in the
Container.js
file - Create a blank page in Notion and create a table on that page
- Add the necessary columns to the table (Page, Slug, Date, Description, Published, Cover Image)
- Get the Notion Integration Token and paste it in the
.env.local
file asNOTION_TOKEN=____
- Share the Notion database with the Notion Integration
- Get the Database ID from the Notion page URL and paste it in the
.env.local
file asNOTION_DATABASE_ID=_____
- Create blog posts in Notion by filling in the necessary fields in the table
- Run locally with
npm run dev
- Deploy your own Notion blog with Vercel
Summary:
This is an open-source starter blog template that combines Next.js, Notion, and Tailwind CSS. It allows for easy content creation and customization and provides a statically generated blog website. With integration with Notion, managing and creating blog posts is made simple. With the option to personalize page meta data and add cover images, this blog template offers flexibility and ease of use. It can be deployed easily with Vercel.