演示文章技术笔记

给文字一个轻盈的家:认识静态博客

把文章保存为普通文件,让网站在发布时生成。用简单的方式,理解静态博客如何工作。

灰蓝色群山与平静水面的原创插画
灰蓝色群山与平静水面的原创插画

本文是用于展示表格、代码和目录的演示教程,不包含性能实测或服务可用性承诺。

文章与页面,是两件事

文章是你写下的内容,页面是读者看到的呈现方式。把二者分开后,新增文章不需要重新设计页面;更换页面样式,也不必逐篇重写文章。

在这个博客中,文章保存在 Markdown 文件里。发布时,Astro 读取这些文件,生成浏览器可以直接打开的网页。

一条清晰的发布路径

写文章 → 提交到 GitHub → Cloudflare 构建 → 静态网页上线

网站上线后,读取文章不依赖持续运行的 Node.js 服务。Node.js 只在安装依赖、构建和本地预览时使用。

一个文章文件的样子

---
title: "今天的新发现"
description: "用一两句话介绍文章内容。"
pubDate: 2026-10-08
category: "生活手记"
tags: ["日常", "写作"]
draft: true
---

上面的 draft: true 表示草稿。改成 false 并提交后,才会进入公开网站。文章地址由文件名或固定的 slug 决定,改标题不会自动改地址。

哪些内容会自动生成

你填写的内容网站生成的内容是否需要修改页面
标题和摘要文章卡片、分享信息不需要
分类分类列表和分类页面不需要
标签标签页面及相关文章不需要
二级、三级标题文章目录不需要

本地构建命令

npm install
npm run check
npm run build

构建结果位于 dist 目录。部署时上传或托管的是这些静态文件,而不是本地预览服务器。

简单,也意味着明确边界

静态博客很适合文章、个人手记和作品介绍。如果未来需要用户登录、实时评论或复杂互动,需要另行评估方案。首版不必为了可能发生的需求增加基础设施。

选择工具时,先问它能否让你持续写作,再问它还能做多少事情。

框架文档可以查看 Astro 官方指南。本文仅解释本项目的使用方式,服务额度以平台当时的说明为准。

— 本文完 —