1 背景
因为是第一次开始搭建博客,刚好时间也较为宽裕,所以计划选择经济投入最少的方式。
参考互联网上大家建的博客后,最终选择了 notion+vercel 来完成我的博客首秀。
本文主要是用于记录我的搭建过程,希望能帮助到正在看文章的你们。
2 三个步骤
只需如下三个步骤即可完成部署:
- 完成 Notion 注册,配置好基础页面并操作发布。
- 完成 Github 注册,下载 transitive-bullshit/nextjs-notion-starter-kit: Deploy your own Notion-powered website in minutes with Next.js and Vercel. 中代码并修改配置文件,创建自己仓库并上传后修改的代码。
- 完成 vercel 注册,导入 Github 创建的仓库,等待构建完成即上线。
简单画了一张图:
Notion 是博客的数据源,所有的文章内容都保存在这里。
Github 是代码的存储仓库,正是因为有大佬@transitive-bullshit 的代码,博客才可以获取到 notion 中的内容。
Vercel 是代码的运行容器,它从 Github 获取到代码后,对代码进行构建,在构建完成后对外提供服务,变成用户可以浏览的博客。
3 详细操作
3.1 完成 Notion 配置
3.1.1 注册 Notion
Notion 的注册也十分简单,点击此处前往官网 完成注册。
现在 Notion 原生支持中文,所以对只懂中文的朋友来说就简单许多了。
3.1.2 配置 Notion 空间
注册完成后,建议单独创建一个空间,专门用于对外发布博客内容。
3.1.3 复制模板至新创建的工作空间
按照作者@transitive-bullshit 的建议,点击此处 复制模板至 Notion 中,注意位置为刚刚新创建的空间。
后续基于该模板更新使用即可。
3.1.4 发布页面
此时可以不着急配置内容,先将页面发布出去,以供代码获取内容。
3.1.5 获取 pageid
发布后,在当前网址最后找到 pageid,先保存下来,以便后续配置。