这是接单日志的第一篇，记录 huangmiao.work 个人站从零到上线的完整过程。
为什么要自建个人站
用过 Notion、Carrd、Framer，最后还是决定自建。
核心原因：内容资产要归自己。 用第三方平台，哪天平台关闭或改规则，内容就不在了。自建站配合 MDX + git，内容版本化，永远归自己。
技术栈选择
- Next.js 14 App Router + TypeScript — 熟悉，RSC 对 SEO 友好
- Tailwind v4 — 新版语法，
@import "tailwindcss"就够了 - MDX + gray-matter — 博客和接单日志都用 MDX，前置 metadata 用 gray-matter 解析
- next-mdx-remote — 服务端渲染 MDX，不需要在构建时静态生成所有页面
设计来源
UI 从之前用 Claude 做的 demo 移植过来，保留了：
- 暗色调 GrowthDashboard（演示用的增长看板）
- 光标跟随的 dots 背景动效
- 滚动进度条
- 双语切换（中/英）
最难的部分是把 React/Babel 的 demo 迁移到 Next.js App Router，主要是处理 "use client" 边界和字体加载。
踩坑记录
1. Tailwind v4 plugin 语法变了
不再是 tailwind.config.ts 里配置，而是在 CSS 文件里用 @plugin "@tailwindcss/typography" 直接引入。
2. next-mdx-remote/rsc 的 async RSC
博客文章页面要用 async function + await params，Next.js 15 开始 params 变成 Promise。
3. 字体变量映射
next/font 生成的 CSS 变量名是 --font-playfair，需要在 :root 里手动映射到 --serif: var(--font-playfair, ...)。
下一步：把个人站部署到 Vercel，绑定 huangmiao.work 域名。