Azure，一个慢慢生长的个人空间

为什么做这个网站

最近做过的项目越来越多，我希望有一个地方能直观看到自己的尝试，也方便以后整理技术分享和阅读思考。

这个网站由 Azure 确定需求与视觉方向，通过 AI 辅助开发迭代实现。目前已能本地运行，尚未部署到公网服务器。这里记录已经实现的功能与可复现的使用流程。

从内容出发

推荐页由我手动排序。项目有自己的详情页，文章与生活记录使用同一套阅读结构。

可迁移的 Markdown

正文与图片放在同一个目录，稳定的地址让内容不会随着标题修改而变化。

const site = {
  name: 'Azure',
  language: 'zh-CN',
  content: 'Markdown',
};

视觉的起点

深藏青、钴蓝与浅天青来自头像。纸纹、玻璃和斜向暖光让页面有一点安静的夏日气息。

已实现的功能

• 推荐列表由配置文件手动排序；首页可原地筛选项目、技术、笔记、生活与小说。
• 项目详情展示技术栈、状态与源码链接；演示和视频链接按需填写。
• Markdown 阅读支持目录、当前章节高亮、阅读进度、代码复制与图片灯箱。
• 内容列表按每页 10 条分页，分类和标签状态可通过 URL 分享或刷新恢复。
• Pagefind 搜索索引保留，但当前搜索入口暂时关闭，待后续继续完善。
• 每次加载分层显现；卡片有轻微倾斜与柔光，导航具有雾蓝悬浮背景。减少动态模式下关闭动画。
• 加入本机写作室：表单填写元信息，Markdown 工具栏编辑正文，支持图片上传、粘贴、草稿保存与阅读预览。
• 内容与代码分仓：原文和图片保存在私有仓库；草稿与发布版本分开，修改草稿不影响已发布文章。
• 本机发布后自动构建网站；GitHub 登录和仅本人访问的权限检查已实现，真实登录仍待配置 GitHub App，服务器部署尚未接通。

私有内容写作

在项目目录运行 npm run admin 后，访问本机的写作室。日常通过“保存草稿”保留修改，“阅读预览”查看正文，再通过“发布版本”生成网站页面。代码仓库保留演示内容；真实内容构建使用 npm run build:private。源码与内容仓库都保持私有。

线上计划使用 GitHub App 登录，只授权本人的私有内容仓库。GitHub Actions 目前用于构建校验，后续再接服务器部署；保存成功、构建成功和网站上线是三个不同的状态。

本地运行与验证

需要 Node.js 22.23.2 或兼容版本。克隆仓库后执行：

npm ci
npm run build
npm run verify
npm run preview -- --port 4321

浏览器打开 http://127.0.0.1:4321/，在推荐页或项目列表进入本页。这里展示的是实际项目资料，其他标有“示例内容”的文章仍是排版演示。

实现与取舍

使用 Astro、TypeScript 与 Tailwind CSS，交互以原生 TypeScript 和 CSS 为主。内容在构建时生成静态 HTML，图片由 Astro 处理，便于先用 Nginx 托管。

这也意味着新增内容后需要重新构建，未来日期不会自动触发部署。目前已有可运行的本机写作后台；线上登录仍待配置 GitHub App，评论、访问统计和服务器自动部署尚未接入。

本页封面暂时使用真实头像素材，尚未替换为项目界面截图；暂无公网演示和演示视频，因此没有填写对应链接。

接下来

• 整理真实项目的截图和演示链接。
• 补充技术文章。
• 完成服务器部署与备份流程。