文章

从 0 到 1 搭建并部署个人博客

从需求梳理、技术选型到上线部署,完整记录一套个人博客的搭建思路。

从 0 到 1 搭建并部署个人博客

很多人想做个人博客,真正卡住的并不是“怎么写第一篇文章”,而是前面那一串看起来零碎的决定:

  • 到底该用什么方案
  • 内容写在 Notion、Markdown 还是数据库里
  • 部署到哪里最省心
  • 域名、SEO、归档、代码高亮这些要不要一开始就考虑

这篇文章就按一个真实的建站流程,把这些问题从头梳理一遍。

先明确:你为什么要做个人博客

个人博客不是社交平台的替代品,它更像一个长期可维护的内容仓库。

我认为它最重要的价值有三点:

  1. 内容归自己所有,迁移成本低。
  2. 文章结构完整,适合沉淀方法和经验。
  3. 可搜索、可归档、可被引用,时间越长价值越大。

如果你只是想快速发点短内容,公众号、即刻、X 这类平台可能更高效。
如果你想写的是一两年后还值得回来看、还能继续更新的内容,博客更合适。

选型之前,先想清楚四个标准

很多人一上来就在框架之间横跳,其实应该先定标准,再选工具。

我会优先看下面四项:

1. 内容是否归自己控制

如果文章本体存在第三方平台里,迁移、备份、导出和长期维护都会受限制。

从这个角度看:

  • 本地 Markdown/MDX 最稳
  • Notion 适合快速写作,但长期控制力弱一点
  • 数据库存内容通常更适合产品,而不是个人博客

2. 维护成本是否足够低

个人博客很容易出现一种情况:搭的时候投入很大,写的时候越来越少。

所以最好的方案不是“最强”,而是“你半年后还愿意维护”的那个。

3. SEO 和性能是否天然不错

博客的核心页面通常是静态内容页。
这类站点天然适合静态生成,因为:

  • 页面快
  • 搜索引擎抓取稳定
  • 部署简单
  • 运维成本低

4. 写作体验是否顺手

你要长期写,就要让发布流程尽量短。

理想状态通常是:

  1. 新建文章文件
  2. 写 frontmatter
  3. 开始写正文
  4. 提交代码并自动部署

常见方案怎么选

方案一:Notion + NotionNext

适合人群:

  • 已经习惯在 Notion 写作
  • 目标是尽快上线
  • 不想碰太多代码

优点:

  • 写作门槛低
  • 主题现成
  • 上线速度快

缺点:

  • 内容不是真正意义上的本地 Markdown
  • 对 Notion 数据结构和网络环境有依赖
  • 长期可控性弱于本地仓库方案

方案二:Hugo

适合人群:

  • 更看重稳定和速度
  • 接受传统静态站点的模板方式

优点:

  • 构建速度非常快
  • 静态博客能力成熟
  • 部署轻量

缺点:

  • 定制体验相对没那么灵活
  • 如果你平时更熟悉前端组件式开发,手感未必最好

方案三:Next.js + MDX

适合人群:

  • 博客后续可能扩成更复杂的网站
  • 需要 API、登录、动态功能或更多应用化能力

优点:

  • 上限高
  • 生态丰富
  • 内容和组件组合能力强

缺点:

  • 对纯博客来说偏重
  • 维护复杂度高于静态博客方案

方案四:Astro + Markdown/MDX

适合人群:

  • 主要目标就是做博客或内容型网站
  • 希望兼顾性能、可维护性和开发体验

优点:

  • 对内容型网站很合适
  • 静态输出天然利于 SEO
  • Markdown/MDX 工作流顺手
  • 比较容易扩展标签、归档、RSS、Sitemap

缺点:

  • 一些博客能力需要自己组合起来
  • 如果后面要做成偏应用型产品,可能还会再加别的东西

我最终怎么选

如果目标是“写技术博客,并且长期维护”,我会优先选:

Astro + Markdown/MDX

原因很简单:

  1. 内容存在仓库里,可迁移。
  2. 页面以静态输出为主,适合博客。
  3. 部署简单,不需要自己维护服务端。
  4. 标签、归档、代码高亮、SEO 这些都不难补齐。

从 0 到 1 的搭建步骤

下面是一套比较实用的流程。

第一步:注册域名

域名不一定要第一天就买,但最好尽早想名字。

建议:

  • 尽量短
  • 容易记
  • 不要和平台绑定过深

常见后缀:

  • .com:最通用
  • .cn:更偏国内
  • .me:适合个人站
  • .dev:技术向比较常见

第二步:确定仓库和写作目录

我习惯把博客当成一个普通代码仓库管理。

目录结构可以很简单:

src/
  content/
    blog/
      from-zero-to-one-personal-blog.md
  pages/
    index.astro
    blog/
    tags/
    archive/

文章本身放在 src/content/blog,这样归档、标签和列表都可以从文章元数据自动生成。

第三步:定义 frontmatter

每篇文章至少应该有这些字段:

---
title: "文章标题"
description: "摘要"
publishDate: 2026-06-09
updatedDate: 2026-06-09
tags: ["博客", "建站"]
cover: "/images/cover.jpg"
draft: false
---

这些字段足够支撑:

  • 首页文章卡片
  • 文章详情页
  • 标签页
  • 归档页
  • SEO 描述

第四步:本地启动和写作

开发阶段一般只需要两个命令:

npm install
npm run dev

写作流程也尽量简单:

  1. 新建一篇 Markdown 文件
  2. 填 frontmatter
  3. 写正文
  4. 本地预览
  5. 提交并发布

如何部署到线上

对于个人博客,我建议优先用静态托管平台。

最常见的是:

  • Vercel
  • Netlify
  • Cloudflare Pages

如果你已经在用 GitHub,最顺手的流程通常是 GitHub + Vercel。

用 Vercel 部署的大致步骤

  1. 把博客代码推到 GitHub 仓库。
  2. 登录 Vercel。
  3. 选择 Add New Project
  4. 导入你的 GitHub 仓库。
  5. 让平台自动识别构建配置。
  6. 构建命令设为 npm run build
  7. 输出目录使用默认的 dist
  8. 点击部署。

第一次上线后,Vercel 会给你一个默认域名,例如:

your-blog.vercel.app

后续你再把自定义域名绑定上去就可以。

自定义域名怎么接

通常流程是:

  1. 在域名服务商那里买好域名
  2. 在托管平台里添加域名
  3. 按提示配置 DNS 记录
  4. 等待解析生效

域名接好后,记得把站点配置里的正式地址改掉,例如:

https://yourdomain.com

这样生成出来的 canonical、Open Graph 和 sitemap 才会是正确的正式链接。

上线前别漏掉这些细节

1. SEO 基础项

至少补齐:

  • 页面标题
  • 描述
  • canonical
  • Open Graph
  • sitemap
  • robots.txt
  • RSS

这些不复杂,但很值得一开始就做好。

2. 代码高亮

如果你写技术内容,代码块几乎是必需品。

一个能用的博客至少要做到:

  • 代码高亮清晰
  • 长代码块能横向滚动
  • 行距和字体可读

3. 标签和归档

标签适合按主题阅读,归档适合按时间回看。

它们不是核心内容,但对长期积累的博客非常有用。

4. 图片路径和资源管理

图片最好统一放目录,例如:

public/images/

这样在 Markdown 里引用会比较稳定:

![封面图](/images/cover-launch.svg)

我建议的最小可行版本

如果今天就要上线,不需要一开始做得太满。

一个够用的第一版博客只需要:

  1. 首页
  2. 文章列表页
  3. 文章详情页
  4. 关于页
  5. 标签和归档
  6. SEO 基础项
  7. 自动部署

评论、搜索、统计、阅读量、深色模式,这些都可以放到后面再说。

最后:真正重要的不是框架,是持续写

很多博客夭折,不是因为框架选错了,而是因为前期把“建站”做成了主线,把“写作”放到了后面。

更稳的做法是:

  1. 先选一个维护成本低的方案
  2. 尽快完成部署
  3. 尽快开始写第一篇文章
  4. 在写作过程中再逐步补功能

博客这件事,最有价值的部分从来不是首页有多好看,而是几年后你还能稳定地往里面放内容。