蔚蓝空间栈
关于蔚蓝

目标:3 小时内做出一个能放到 GitHub + 能挂到自己域名的个人主页。不学语法,只跑流程。

你会做出什么

mysite/
├── src/pages/index.astro # 首页
├── src/pages/projects.astro # 作品集
├── src/pages/about.astro # 关于我
├── public/avatar.jpg
└── package.json

最终效果:响应式、有暗黑模式、3 个页面。

准备

  1. 装好工具(详见 装工具) —— Node 22+ / Git / Claude Code

  2. 建项目目录

    Terminal window
    mkdir mysite && cd mysite
    git init
    claude
  3. 打开 Claude Code 后说

    我想做一个个人主页,技术栈用 Astro + Tailwind。
    包含三个页面:首页、作品集、关于我。
    要有暗黑模式、响应式。
    先帮我初始化项目骨架,有不清楚的先问我。

第 1 小时:骨架

让 Claude 跑 pnpm create astro@latest,选 minimal 模板。然后告诉它:

- 加上 @astrojs/tailwind
- 把首页改成 hero 居中布局,标题"你的名字 · Lead AI · Build everything"
- 加一个 navbar,三个链接:首页 / 作品集 / 关于我

15 分钟后你会有一个能跑的骨架。

第 2 小时:填内容

把你真实的内容喂给 Claude:

  • 一段自我介绍(200 字以内)
  • 3 个你做过的项目(哪怕是学校作业)
  • 一张头像
按这些内容把三个页面填好。
作品集做卡片网格,每张卡是 项目名 + 一句话描述 + 截图。
关于我做一个长文版本,分 4 段:现在在做什么 / 过去经历 / 喜欢什么 / 怎么找我。

第 3 小时:润色

- 加 favicon
- 加 meta 标签做好 SEO
- 加暗黑模式切换按钮(不要用 cookie,用 localStorage)
- 检查移动端是否好看

接下来

把它 push 到 GitHub,然后看 部署上线 把它挂到公网。