Skip to content
/ jarocki.me Public template

🚀 Personal website / blog / portfolio built using TypeScript, Next.js, Tailwind CSS and Notion API

License

Notifications You must be signed in to change notification settings

BartoszJarocki/jarocki.me

Repository files navigation

screenshot

Bartosz Jarocki - Personal website built using Next.js and Notion as headless CMS

This is my personal website built using

Running locally

To run application locally few environment variables have to be defined (in .env.local):

  1. NEXT_PUBLIC_URL - used to create absolute urls, for example canonical links and open graph images
  2. NOTION_TOKEN - used by Notion API client, nore info here
  3. NOTION_DATABASE_ID - used to fetch notes/blog post list

There'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:

  1. id
  2. created_time
  3. last_edited_time
  4. cover
  5. hashtags
  6. title
  7. description
  8. slug - used as a notes slug for example in /notes/hello-world the slug would be hello-world
  9. published - used to filter unpublished notes from available notes list
  10. publishedAt
  11. inProgress - used to display Work in progress badge on in the notes list

Here's how the database in Notion should look like:

notion

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

OG images generation

Application generates Open Graph images automatically using lambda functions and Puppetter

Main page example main page OG image

Blog post example blog post OG image

Credits

Design heavily inspired by Tailwind UI Spotlight template

Deploy to Vercel

Deploy with Vercel

License

MIT

About

🚀 Personal website / blog / portfolio built using TypeScript, Next.js, Tailwind CSS and Notion API

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published