项目迁移记录：从 Vercel 到 GitHub + Cloudflare

背景

之前我的项目（个人主页、博客、ARG 游戏以及模拟 OS 页面）主要部署在 Vercel，并配合一台自有服务器使用。随着项目逐渐增多，这种方式开始显得有些混乱：静态资源和后端逻辑混在一起，服务器也没有被很好地利用。

这次我对整体架构做了一次整理，把“该放哪的东西”重新归位。

调整思路

核心其实很简单：

静态资源交给 CDN，服务器只负责后端和数据。

本次调整内容

1. 前端整体迁移

所有静态项目迁移至 GitHub，并通过 Cloudflare Pages 部署
包括：
- 个人主页
- 博客
- ARG 游戏
- 模拟 OS 页面

这样做之后，部署流程变成：

本地开发 → push 到 GitHub → 自动构建部署

不再需要手动上传或维护服务器环境。

2. 主页重构为 Astro

主页迁移至 Astro
采用以静态生成（SSG）为主的方式构建页面
尽可能减少客户端 JavaScript

主要目的：

提升首屏加载速度
降低不必要的客户端渲染开销
保持结构简单、可维护

3. 域名与访问

使用 Cloudflare 统一管理域名与解析
不同项目通过子域名区分，例如：
- yourdomain.com → 主页
- arg.yourdomain.com → ARG 游戏
- os.yourdomain.com → 模拟 OS

4. 自有服务器重新定位

原本服务器同时承担静态资源和部分后端功能，现在做了明确拆分。

目前只保留以下用途：

后端 API（后续扩展）
数据存储
项目备份

不再部署任何静态页面。

当前架构

[ GitHub + Cloudflare Pages ]
        ↓
   静态前端（Blog / Home / ARG / OS）

[ 自有服务器（Oracle Free Tier） ]
        ↓
   API / 数据 / 备份

一些实际感受

这次调整之后，最大的变化是“简单了很多”。

前端部署几乎不用管，提交代码就自动上线
不再需要折腾服务器上的 Nginx、证书之类的东西
服务器可以专心跑真正需要它的部分

整体也更接近常见的前后端分离架构，后面要加功能会更自然。

后续计划

增加简单的后端 API（可能用 Rust）
给博客加评论系统
为 ARG 游戏增加进度存储或排行榜
做一套自动备份策略

这次迁移不算复杂，但把结构理顺之后，后面开发会轻松很多。

Migration Notes: From Vercel to GitHub + Cloudflare

Background

My projects — personal homepage, blog, ARG game, and simulated OS page — were previously deployed on Vercel alongside a self-hosted server. As the number of projects grew, things started getting messy: static assets and backend logic were mixed together, and the server wasn’t being used effectively.

I took this opportunity to reorganize the overall architecture and put everything in its proper place.

The Core Idea

It’s actually pretty simple:

Hand static assets off to a CDN. The server only handles backend and data.

What Changed

1. Frontend Migration

All static projects moved to GitHub, deployed via Cloudflare Pages
This includes:
- Personal homepage
- Blog
- ARG game
- Simulated OS page

The deployment workflow is now:

Local development → push to GitHub → automatic build and deploy

No more manual uploads or maintaining server environments.

2. Homepage Rebuilt with Astro

Homepage migrated to Astro
Primarily static site generation (SSG)
Minimal client-side JavaScript

Goals:

Faster initial load
Reduced unnecessary client-side rendering overhead
Simple, maintainable structure

3. Domain and DNS

Cloudflare handles all domain management and DNS
Different projects use subdomains, for example:
- yourdomain.com → homepage
- arg.yourdomain.com → ARG game
- os.yourdomain.com → simulated OS

4. Self-Hosted Server Refocused

The server previously handled both static assets and some backend functions. Now there’s a clear separation.

Current uses only:

Backend API (for future expansion)
Data storage
Project backups

No static pages deployed to it anymore.

Current Architecture

[ GitHub + Cloudflare Pages ]
        ↓
   Static frontend (Blog / Home / ARG / OS)

[ Self-hosted server (Oracle Free Tier) ]
        ↓
   API / Data / Backups

Reflections

The biggest change after this migration is that everything feels much simpler.

Frontend deployment is nearly hands-off — push code and it’s live
No more dealing with Nginx configs or SSL certificates on the server
The server can focus on what it’s actually needed for

The overall architecture is also closer to a standard frontend/backend separation, which makes adding new features more natural.

What’s Next

Add a simple backend API (possibly in Rust)
Add a comment system to the blog
Add progress saving or a leaderboard to the ARG game
Set up an automated backup strategy

This migration wasn’t complicated, but having a clean structure will make future development a lot easier.