The project is mainly based on nuxt-3-notion-blog. But I added some features like the sitemap, category fetching, dark/light mode, and some other minor changes.
This project is a blog built with Nuxt.js for server-side render website and Notion API as the database.
# .env
NOTION_API_TOKEN=your_notion_integration_token
NOTION_POST_DATABASE=your_notion_posts_database// nuxt.config.js
public: {
BLOG_NAME: "YJack's blog",
GITHUB_PAGE: '<your_github_page>',
LINKEDIN_PAGE: '<your_linkedin_page>',
NOTION_ABOUT_PAGE: 'page_by_slug_17c6e514c9a549659e7775e5d17546b5',
NOTION_ABOUT_PAGE_BLOCK: '4bc3731306444831b824c95c7a6ad868'
},| Title | Description | Category | Author | Date | Visible |
|---|---|---|---|---|---|
type: Key |
type: Text |
type: Multi-select |
type: Person |
type: Date |
type: Checkbox |
There is a file in scripts/generate-sitemap.js will generate a sitemap.xml file in the root of the project. This file is used by search engines to index your site.
npm run build// About page setup
public: {
// ...
NOTION_ABOUT_PAGE: 'page_by_slug_17c6e514c9a549659e7775e5d17546b5',
NOTION_ABOUT_PAGE_BLOCK: '4bc3731306444831b824c95c7a6ad868',
},// DISQUS Comment setup
public: {
// ...
DISQUS_PROJECT_ID: 'huan-3',
},- Add /about Page for
About - Add a comment section
- Cache the Notion API data on vercel service