Astro 入门指南：从零搭建现代博客

什么是 Astro？

Astro 是一个专为内容驱动网站设计的 Web 框架。它的核心理念是：默认零 JavaScript。

这意味着你的页面在浏览器中加载时，不会发送任何不必要的 JavaScript。只有当你需要交互时，才会按需加载。

为什么选择 Astro？

与其他框架相比，Astro 有几个独特优势：

特性	Astro	Next.js	Nuxt
默认零 JS	✅	❌	❌
Island 架构	✅	❌	❌
内容集合	✅	✅	✅
构建速度	快	中	中

快速开始

# 创建项目
npm create astro@latest my-blog

# 安装依赖
cd my-blog && npm install

# 启动开发服务器
npm run dev

Island 架构

Astro 的 Island 架构是它最创新的特性。页面的大部分是静态 HTML，只有需要交互的部分才会加载 JavaScript：

---
// 这部分在构建时执行，不会发送到浏览器
const posts = await getCollection('posts');
---

<!-- 这是静态 HTML -->
<h1>我的博客</h1>

<!-- 这是一个 "Island"，会按需加载 JS -->
<ReactCounter client:visible />

总结

Astro 非常适合博客、文档站、营销页等内容驱动的网站。如果你想要一个又快又灵活的站点，值得一试。