完全免费！手把手教你用GitHub和Vercel搭建个人博客

前言

在这个数字化时代，拥有一个个人博客是展示技术能力、分享知识和建立个人品牌的好方法。今天，我将带你一步步使用GitHub和Vercel，基于Astro-theme-Cactus-zh_CN主题搭建一个现代化博客，并绑定自定义域名。

什么是Astro-theme-Cactus-zh_CN？

Astro-theme-Cactus-zh_CN是一个基于Astro框架的静态博客主题，它是经典Cactus主题的中文优化版本。Astro是一个新兴的静态站点生成器，以其出色的性能和灵活性而闻名。这个主题具有响应式设计、暗色模式、标签分类等现代博客所需的所有功能。

准备工作

在开始之前，请确保你已经拥有：

GitHub账户（如果没有，请前往github.com注册）

Vercel账户（可以使用GitHub账户直接登录）

一个自定义域名（可选，但推荐）

快速开始 🚀

访问 Astro-theme-Cactus-zh_CN 项目页面

1. 点击 Fork 按钮，复制本项目到你的GitHub 仓库
2. Vercel

 注册登录，关联 GitHub 账户，导入仓库 3. 添加一个

GitHub认证

，得到 Oauth ID 和 secret

• Homepage URL —— 

  https://你的域名

• Authorization callback URL —— 

  https://域名/oauth/callback

1. 在 Vercel -> Settings -> Environment Variables，添加2个环境变量

• OAUTH_GITHUB_CLIENT_ID -> Oauth ID
• OAUTH_GITHUB_CLIENT_SECRET -> Oauth secret

1. 修改GitHub仓库public/admin/config.yml，修改repo、site_domain、base_url
2. 通过访问你的域名/admin访问博客后台，进行编辑、发布文

个性化配置 ⚙

• 修改导航栏标题，图片 -> 

  src/components/layout/Header.astro

• 修改网站配置 -> 

  src/site.config.ts

• 修改框架配置 -> 

  astro.config.ts

• 修改社交图标链接 -> 

  src/components/SocialList.astro