🚀 Personal website / blog / portfolio built using TypeScript, Next.js, Tailwind CSS and Notion API
MIT License
This is my personal website built using
To run application locally few environment variables have to be defined (in .env.local
):
NEXT_PUBLIC_URL
- used to create absolute urls, for example canonical links and open graph imagesNOTION_TOKEN
- used by Notion API client, nore info here
NOTION_DATABASE_ID
- used to fetch notes/blog post listThere's a certain data format of Notion database that's needed by application. When fetching the database content, application expects the following properties to be configured in the database:
id
created_time
last_edited_time
cover
hashtags
title
description
slug
- used as a notes slug for example in /notes/hello-world
the slug would be hello-world
published
- used to filter unpublished notes from available notes listpublishedAt
inProgress
- used to display Work in progress
badge on in the notes listHere's how the database in Notion should look like:
After defining environment variables and your Notion database, run the application
git clone https://github.com/BartoszJarocki/web-jarocki-me
cd web-jarocki-me
yarn
yarn dev
Application generates Open Graph images automatically using lambda functions and Puppetter
Main page example
Blog post example
Design heavily inspired by Tailwind UI Spotlight template