svelte-notion-kit
svelte-notion-kit copied to clipboard
Brings your Notion pages to SvelteKit
Svelte Notion Kit
Boilerplate to quckly get up and running with Svelte and Notion, with
- Typescript as the language choice
- Tailwind CSS for quick styling without getting out of your HTML
- ESLint for static code analysis
- Prettier for code formatting
- SEO pre-configured
- Icons support out of the box
How to configure Notion?
- Retrieve a
NOTION_TOKEN
by following their Getting Started guide - Create a table as the database of your content, and copy its
id
. Maintain it asNOTION_DATABASE_ID
- Add following columns as a post attribute
-
title
(title) - For post title -
summary
(text) - For post summary -
tags
(multi-select) - For post tags -
author
(person) - For post's Author -
published
(checkbox) - Published? (un-used currently)
-
How to configure the SvelteKit App?
- The
NOTION_TOKEN
andNOTION_DATABASE_ID
is expected to be available in your Vercel/Netlify account as environment variables. Add them, fork the project and deploy on Vercel. - The project uses the @sveltejs/adapter-vercel by default. If you want to deploy on Netlify, install @sveltejs/adapter-netlify and change the
adpater
key insvelte.config.js
to `netlify() -
Your local instance expects
VITE_
prefixed with the aforementioned environment variables to run. Refer.env.example
for help.