我的第一篇文章是2020年时候写的,通过hugo+vps自建博客。
人懒起来是真的懒,自从vps的ip被炸了以后,一直都提不起劲来部署到新的vps上。即使后来ip出狱了也没再写过文章了。
现在用notion写文章,然后自动部署到vercel上。希望换种方式能让自己继续写起来。
0. 使用到的工具
- notion:进行文章的编写
- nobelium:访问notion,采集文章生成静态页面
- cusdis:评论系统
- vercel:部署nobelium并提供静态页面访问。部署自建的cusdis。
- railway:部署一个postgresql,作为自建的cusdis评论数据库。
1. 设置notion
先把nobelium的notion页面模板复制过来

把这个notion页面设置为公开

删除别的文章,只保留一篇

后续可以随便修改文章,但是我开始遇到如果使用全部文章,部署的时候会出错。只保留一篇文章就没事。
2. 部署nobelium
fork一下nobelium

去到自己fork的nobelium仓库,点击
blog.config.js
进行自定义修改
可以修改
- title:浏览器网页标签里显示的文字
- author:你的名字
- email:你的email,不想写的话可以留空
- description:描述
- lang:网站选项显示的语言
- sortByDate:文章按照日期排序
都修改好以后就可以保存了。注意不要选点第二个,那个是会通知到原作者的。

接着是把nobelium部署到vercel。
在vercel中登录,可以通过github账号登录。
导入fork的nobelium项目


打开notion里设置为公开的那个页面

这一部分就是
NOTION_PAGE_ID
填入
NOTION_PAGE_ID

填好以后点击deploy,等待部署完成。
点一下这里,可以看到博客已经部署完成啦。

如果你有自己的域名,可以设置使用自己的域名来访问。

去到自己域名的dns服务商那里,添加一条cname记录,就是转发到vercel这个域名。


3. [可选]添加cusdis评论系统
cusdis目前是免费提供服务的,可以使用cusdis提供的服务,也可以选择自建。

读者通过cusdis发表的留言会经过你的审核以后才会显示在博客文章下面。

3.1 使用cusdis提供的服务
使用cusdis服务非常方便,先注册账号,https://cusdis.com/,然后添加自己的博客地址
获得app-id:

复制这个
data-app-id
,填入到nobelium的 blog.config.js
中:
provider中填cusdis,appId中填你的data-app-id,保存修改。
vercel重新部署以后就能在文章底部看到cusdis了。
3.2 自建cusdis
cusdis使用nextjs编写,因此也可以非常方便地部署在vercel上。
不过这次的部署需要点额外操作,cusdis需要一个postgresql数据库来存放评论数据,我们可以使用railway免费提供的postgresql数据库。
先注册登录railway,https://railway.app/dashboard。
点击new project,选择 provision PostgreSQL,即可创建一个数据库。

把这个连接数据库的url复制下来,待会在vercel部署cusdis会用到。
fork cusdis,https://github.com/djyde/cusdis
在vercel上new project,导入cusdis
填入这些环境变量

USERNAME
:用于登录的用户名。如果你需要用到邮箱提醒功能,这里填你的邮箱地址。不用担心,后台可以设置别名,不会直接显示你这个邮箱。
PASSWORD
:用于登录的密码
DB_URL
:railway那里的数据库连接,(类似于postgresql://johndoe:randompassword@localhost:5432/mydb
)
JWT_SECRET
:随便输入一段数字字符
点击部署等待完成。
部署完以后,还需要填两个环境变量,两个环境变量都填vercel分配给我们的域名。


NEXTAUTH_URL HOST
重新部署一下,点开就能进行登录了。


自建cusdis要在
blog.config.js
中要填入这三个:
保存修改后,等待vercel重新部署,刷新一下文章就能看到cusdis了。
3.3 [可选]配置自建cusdis的邮箱提醒功能
https://cusdis.com/doc#/features/notification,在cusdis文档里有详细的gmail、qq邮箱、163邮箱的设置方式。
我使用的是gmail,仅介绍gmail的配置过程。
先给你的谷歌账号生成一个一次性密码:https://myaccount.google.com/security

把这个一次性密码复制下来
填入环境变量:

SMTP_HOST=smtp.gmail.com SMTP_PORT=465 SMTP_SECURE=true SMTP_USER=your gmail email SMTP_PASSWORD=<app password> SMTP_SENDER=your gmail email
重新部署cusdis。
去cusdis后台设置一下:

然后在文章下面回复一条留言,测试是否成功收到提醒邮件。
提醒邮件是自己的邮箱发送给自己的。
注意一次性密码只能用一次,用过一次后要重新设置一个。

如果这里的免登陆通过留言的连接是错误的,是因为你
HOST
环境变量没填好,请检查下是否没填,或者填错了vercel分配给你的域名。4. 编写文章

完成
之后只要在notion中修改了文章,博客网站也会自动更新内容。
修改了github里fork的nobelium项目,vercel也会自动重新进行部署。
真的太方便啦!全程不需要操作任何命令行,点鼠标就能进行部署。比两年hugo的方案可方便太多了。
自己部署最麻烦还是要做运维工作,而且修改完还要在git里面commit一下,多多少少还是会消磨不少耐性的。