NotionNext – 非常适合个人博客知识库文档站点的建站工具

NotionNext 是一款无需服务器、配置简单的静态博客生成器。它利用 Notion 的强大编辑功能和 Next.js 的性能优势，让你可以快速搭建属于自己的个人博客，专注于创作。

特性

• 统一写作平台： 所有文章的创作、编辑和管理都可以在 Notion 中完成，无需切换到其他平台。
• 灵活的排版： Notion 提供了丰富的排版功能，让您可以轻松创建美观、易读的文章。
• 云端同步： 所有内容实时同步到云端，随时随地访问和编辑。
• Next.js加持： 基于 Next.js 框架构建，提供出色的性能和 SEO。
• 快速加载： 网站加载速度快，用户体验更好。
• 搜索引擎友好： 有利于搜索引擎优化，提高网站的搜索排名。
• 独立域名： 拥有自己的域名，不受第三方平台限制。
• 数据安全： 数据完全掌握在自己手中，保障数据安全。
• 长期稳定： 随着时间的推移，网站内容不断丰富，域名权重不断提升。
• 快速搭建： 配置简单，无需深入了解技术细节。
• 社区活跃： 有庞大的用户社区和丰富的文档支持。
• 多种风格： 提供多种主题风格，满足不同用户的需求。
• 灵活定制： 可以根据个人喜好自定义主题。

安装

一、创建 Notion 页面

1. 复制模板

   • 先注册并登录您的 Notion 账号。
   • 点击链接打开模板。
   • 在页面右上角点击“Duplicate”按钮，复制模板到您的笔记空间，如下图所示。

2. 获取页面 ID

   • 在 Notion 页面中，点击右上角菜单栏，依次选择 Share → Publish → Share to Web，开启页面分享，并获取共享链接。
   • 页面 ID 是共享链接中的一串32位字母与数字，如下图所示。在链接中，标红部分即为页面 ID，要忽略 ?v= 后面的字符。

   注意：新版 Notion 链接可能会包含页面标题，但页面 ID 始终是32位的字符串。

二、复制源代码

1. 邮箱选择

   • 请勿使用 QQ 邮箱等国内邮箱，推荐使用 Hotmail 或 Gmail，以避免在登录 Vercel 时出现账户封禁提示。

2. 注册和登录 GitHub

   • 点击链接，一键 Fork 项目到您的 GitHub 账户。

三、在 Vercel 部署

1. 准备账号

   • 注册并使用 GitHub 账号登录 Vercel。

2. 导入代码

   • 点击“创建新项目”。
   • 从代码仓库列表中选择并导入 NotionNext 项目。

3. 配置页面 ID 并部署

   • 在项目设置中点击 Environment Variables（环境变量）。
   • 添加名为 NOTION_PAGE_ID 的环境变量，值为第一步获取的页面 ID。
   • 点击 Add 按钮确认添加，之后点击 Deploy 按钮开始部署。

四、完成部署

1. 访问站点
   • 部署完成后，点击页面上的 Go to Dashboard 访问控制台。
   • 在控制台右上角点击 Visit 按钮，或在 Domains 中获取您的网站地址。

官方链接

• GitHub 仓库