一点前言
对于搞一个 blog 网站这件事
3 年前，我会选择 hexo，用 markdown 写内容，经 hexo 解析基于模版构建成静态网页，何况它还有这么多的社区主题可供选用
1年前，我会用 valaxy ，我的朋友搞的「modern」博客框架，拥有 vite、esbuild 带来的热更新与用户加载体验，还可以用 vue3、atom css 来定制主题UI
但这些对于我今天讲的，都太折腾了
我选择写 notion 笔记，分享它，然后自动同步更新到我的个人网站上
那么开始吧！
开头就是致谢
首先感谢下互联网上善良的好心人（以下都免费），这些都是我们会用到的工具
- notion，知名笔记&知识库应用
- github，代码托管
- Vercel，静态文件托管和网站部署
vercel 会提供一个可使用的域名，若你想要一个更好更适合自己的域名，可以使用 namesilo，这是全球买域名最便宜的平台之一了，重点是它续费不涨价（腾讯☁️、阿里☁️ 指指点点）
- 然后我们可以使用 CloudFlare，使用它的 DNS 和 SSL/TLS 服务，将 vercel 的免费域名映射到自己挑选的域名上
如何拥有上述网站的账号呢，可以直接去官网，直接用邮箱注册。
这些网站是目前全球范围内，最流行的个人开发者基建工具。无论是不是程序员，拥有它的账号和学会使用它提供的便利，对个人来说，是一件很有帮助的事情
旅程
原理介绍
如何将 notion 笔记转换成个人网站的博文，主要使用了这两个工具：
- react-notion-x，一个 notion 的 React 渲染器，也就是说，可以把 notion 笔记渲染成 React 元素
- nextjs-notion-starter-kit，是一个解决方案，基于 react-notion-x 、Next.js 和 Vercel，可开箱即用地构建、部署自己的 notion 个人博客网站
nextjs-notion-starter-kit 是 github 上的一个开源仓库（感谢开发者），我们可以直接 fork 使用它
编写笔记
你可以在 notion 里写自己的笔记，开启该篇笔记分享，copy 它的
id，例如我这里7bff5ef37121490db811d32e19840d53
创建仓库
到 github fork nextjs-notion-starter-kit 这个仓库，可自己改名，如 notion-blog
只需修改 site.config.ts 这个文件，修改有：
- rootNotionPageId，替换成你上面 copy 的 id
- domain，替换成部署的域名
- 别的 name、author 自己发挥
部署与发布
在 vercel，使用 github 登录，点击新建项目，将 notion-blog 导入，点击 deploy，这里可以看到一个暂时的预览链接，接下来我们将之更换为自己的域名
首先要做一个 DNS 映射，在 CloudFlare 中加入一条映射规则，将 notion.xxxxx.cn 映射到 cname-china.vercel-dns.com 这是 vercel 在国内的 dns 地址
然后，在 SSL/TLS 中 将 encryption mode 设为 Full，这是 vercel 的安全要求（人家一定要 https）
接下来回到 vercel ，在项目中，点击 add domain，把 notion.xxxxx.cn 加进去，然后就可以通过这个域名访问到你的页面啦～
而且接下来你什么都不用做了，只需要写 notion 笔记就好了，自动构建自动部署，这样就快乐了