English | 中文

This is an example Next.js project that shows Nuxt.js' support using Notion's private API for a backend. Deploy to netlify.

https://xyu.house/

• minimal and clean portfolio
• the dark/light mode (Auto detect the system color-mode)
• responsive (tablet & mobile friendly)
• render articles from Notion 🚀
• fetches your Github pinned projects with most stars
• Eslint & Prettier configured
• google analytics integration
• generate sitemap (visit /sitemap.xml)
• one click deployment to netlify

create Notion account duplicate this template by clicking on "duplicate" button located at the top of the page.

make your notion table public (by clicking on "share" button located at the top of the page)

grab the table id from the table link: eg:

• link: https://www.notion.so/xyblog/449c4b42aeb7409e9c02405c45d9f519?v=18afdb78dc8e4e03a727e994ac205a74
• id: 449c4b42aeb7409e9c02405c45d9f519

do the same thing for about page id (we gonna use it as an env variable NOTION_ABOUT_PAGE_ID) get your Google analytics id (optional) now you can click to the deploy button and fill the netlify form

create a .env file with the following variables

• BASE_URL=[your domain]
• GOOGLE_ANALYTICS_ID
• NOTION_TABLE_ID
• NOTION_ABOUT_PAGE_ID
• GITHUB_USERNAME
• DEV_LOGO
• DEV_NAME
• DEV_DESCRIPTION
• DEV_ROLE
• DEV_GITHUB_LINK
• DEV_TWITTER_LINK
• DEV_LINKEDIN_LINK

then you can try to run it.

$ yarn install

$ yarn dev