type
status
date
slug
summary
tags
category
icon
password
Notion Bookmarks —— 把你的收藏夹升级为「可分享」的起始页
只需将网页链接保存到 Notion 数据库，系统即自动抓取 favicon、标题与摘要，实时生成高颜值、多主题切换的导航站。
核心亮点
- 零成本：纯静态站点（Next.js + TailwindCSS），不依赖后端或数据库
- 一键部署：Fork → 配置环境变量 → Vercel 上线，整个流程不到 3 分钟
- 高颜值：深/浅色主题、响应式布局，自带时钟与天气微组件
- 易扩展：支持多级分类、关键词搜索、自定义域名，SEO 友好
用 Notion Bookmarks，让散落各处的收藏一次性归位，随时随地优雅开启你的网络旅程。
📝 主旨内容
🤗 一、准备账号
- github账号：注册github https://github.com/signup
- vercel账号: 注册vercel 可以使用github账号登录。
- notion账号：注册notion https://www.notion.so/login
📎 二、复制Notion模板
直接复制这个 Notion 模板 到你的工作区。
- 点击右上角的复制按钮
2. 保存到你的notion空间
三、创建Notion集成，并添加到表格中
1. 访问 Notion Developers 创建一个新的集成
2.名称自定义，空间选择默认，类型：内部
3. 获得集成后记下来集成密钥，点击显示后可复制
4.复制后点击左上角图标
5. 将集成添加到表格中，打开notion中的模板，点击右上角三个点-集成-集成名称
四、准备环境变量的值
找个文本编辑软件，粘贴下面的值，并按本节的截图所示获得你自己的id替换下面的文本，后边要用。
第1个NOTION_TOKEN的出处：
第2个NOTION_LINKS_DB_ID的出处：
浏览器打开notion，找到URL里红色框出来的在斜杠后面，问号前面的这一串字符
第3个NOTION_WEBSITE_CONFIG_ID的出处：
同上一步，点击导航链接时，地址栏中间的字符；
第4个NOTION_CATEGORIES_DB_ID的出处：
同上上步，点击导航链接时，地址栏中间的字符；
五、复制源代码
- 请先注册并登陆Github账号，
- 仅需点击下方链接，即可一键Fork(复刻)项目。
六、Vercel部署
准备账号
注册登陆Vercel ，这里推荐选择Github账号登录。
导入代码
- 点击下方创建新项目
2. 在代码仓库列表中选择导入notion-bookmarks
3.项目名称自定义，之前保存的环境变了全部直接复制粘贴到这里，后点击deploy
等待部署成功
六、自定义域名
输入自定义域名后保存
会出现红色错误提示Invalid Configuration；点击旁边的learn more,在域名托管处增加cname计量；
打开自定义域名，即可访问了
- Author:NotionNext
- URL:http://preview.tangly1024.com/technology/Notionbookmark
- Copyright:All articles in this blog, except for special statements, adopt BY-NC-SA agreement. Please indicate the source!
