不知不觉间,我折腾博客也已经三年多了。随着 AI 以及技术的发展,现在搭建博客相比前几年,无疑是简单太多了。
很多想写博客的朋友,可能一听说要买服务器、配域名、搞 SSL 证书,就被劝退了。其实完全不用这么麻烦,用静态博客托管到 Vercel 上,可以让你非常方便地拥有一个自己的博客。
这篇文章会教你怎么用 Astro 生成博客,然后一键部署到 Vercel 上。如果你不需要自定义域名的话,那本文的所有操作都是完全免费的。
前置准备
你只需要一样东西:
- 一个 GitHub 账号,用于存放博客仓库
没有的话去 GitHub
选择主题模板
Astro 是一个静态站点生成框架,简单来说,它会提前把你的博客页面全部生成好,用户访问的时候直接加载现成的页面,所以速度非常快。你只需要负责写 Markdown 文章,Astro 帮你把它们变成好看的网页。
Hexo 也是静态框架,但个人感觉无论是上手难度还是性能,Astro 都后来者居上。
你可以去官方市场

创建仓库
fork 项目
找到主题的 GitHub 仓库,点击右上角的 Fork,或者使用模板创建。

一般来说,选择 fork 或者使用模板都可以,效果是一样的。

随后进入创建仓库的界面,仓库名称可以按需修改,其他设置保持默认就行。
部署到 Vercel
什么是 Vercel
Vercel 是一个前端托管平台,简单来说就是帮你把写好的网站发布到互联网上,别人就能访问了。它对静态网站的支持非常好,而且免费额度对于个人博客来说完全够用。
导入项目
访问 Vercel
点击右上角的 Add New,选择 Project。

然后导入刚刚 fork 的仓库。

构建部署
点击 Deploy,开始构建部署。

稍等片刻,看到状态显示为 Ready,就代表部署成功了。
Vercel 会为你自动分配一个域名,类似 xxx.vercel.app。

点击域名访问,博客就成功显示出来了。

日常更新
以后写完新文章,只需要把 Markdown 文件扔到项目的文章目录下,然后 git push 推送到 GitHub,Vercel 会自动检测到变更并重新部署。
可选:绑定自定义域名
Vercel 分配的 xxx.vercel.app 域名虽然能用,但如果你想用自己买的域名,也是可以绑定的。
在 Vercel 添加域名
进入项目 → Settings → Domains → 输入你的域名,比如 blog.yourname.com。
Vercel 会提示你需要添加一条 DNS 记录。
配置 DNS
去你的域名服务商(阿里云、腾讯云、Cloudflare 等),添加一条 CNAME 记录:
| 主机记录 | 记录类型 | 记录值 |
|---|---|---|
blog(你想用的子域名) |
CNAME |
cname.vercel-dns.com |
保存后等几分钟,域名就生效了。Vercel 会自动帮你配置 HTTPS 证书,不需要自己折腾。
可选:国内访问加速
如果你主要读者在国内,Vercel 默认的域名访问速度可能不太理想。可以用这个开源项目 enhanced-FaaS-in-China
操作步骤
- 在 Vercel 绑定好你的自定义域名,等待 SSL 证书生成
- 去你的域名服务商(阿里云、腾讯云等),将域名的 CNAME 记录改成:
| 主机记录 | 记录类型 | 记录值 |
|---|---|---|
blog(你的子域名) |
CNAME |
vercel-cname.xingpingcn.top |
- 等待 DNS 生效即可
这个项目的 CNAME 记录大约每 40 分钟更新一次,会自动挑选当前最快的节点,比 Vercel 官方默认的线路稳定很多。
优缺点总结
优点
- 零成本:不需要买服务器,Vercel 免费额度足够个人博客使用
- 部署简单:关联 GitHub 后,推送代码自动部署,省心省力
- 性能好:静态网站,加载速度快,不依赖后端
- 无需运维:不用担心服务器被攻击、系统升级、宕机等问题
- HTTPS 自动配置:Vercel都自动提供证书
缺点
- 国内访问不稳定:Vercel 在国内没有节点,部分网络环境下加载较慢,需要搭配 CDN
- 功能受限:静态博客只能展示内容,不能做用户注册、评论系统(可以外挂第三方评论)等动态功能
- 主题修改有门槛:这一点下面单独说
关于主题修改
Astro 主题本质上是代码,和 WordPress 那种可视化拖拽改主题不一样。好处和坏处都很明显:
如果你有编程基础,Astro 的主题自由度非常高——想改布局、换配色、加功能,直接改代码就行,能做出完全属于你自己的风格。
如果你不熟悉编程,也不用太担心。现在 AI 已经很成熟了,把你想要的效果描述给 AI,让它帮你改代码,然后复制粘贴进去就行。大部分主题的调整(换颜色、改字体、加页面)AI 都能搞定。