这是我的个人站点，用 Next.js 16 + Tailwind CSS v4 + MDX 搭建，部署在 Vercel 上。
技术栈
- 框架：Next.js 16 App Router
- 样式：Tailwind CSS v4
- 内容：MDX（支持在 Markdown 中嵌入 React 组件）
- 部署：Vercel
为什么用 MDX
MDX 让我可以在文章里直接使用 React 组件，比如这样的提示框：
MDX = Markdown + JSX，写文章的同时还能嵌入交互组件。
代码示例
// 获取所有博客文章
export function getAllPosts(): BlogPost[] {
const files = fs.readdirSync(BLOG_DIR)
return files
.map((file) => parsePost(file))
.filter((post) => post.published)
.sort((a, b) => (a.date < b.date ? 1 : -1))
}就是这样，后续会持续更新。