GitHub + Cloudflare Pages

Một repo `websites`, nhiều site, nhiều domain

Mỗi folder trong repository được map thành một Cloudflare Pages project riêng. Phù hợp cho HTML/JS tĩnh hoặc output đã build sẵn.

1. Kiến trúc

GitHub
└── websites
    ├── site-a/
    │   ├── index.html
    │   ├── css/
    │   └── js/
    ├── site-b/
    │   ├── index.html
    │   ├── css/
    │   └── js/
    └── site-c/
        ├── index.html
        ├── css/
        └── js/

Folder	Pages project	Root directory	Output
`site-a`	`site-a`	`site-a`	`.`
`site-b`	`site-b`	`site-b`	`.`
`site-c`	`site-c`	`site-c`	`.`

Lưu ý: Cloudflare Pages hiện giới hạn tối đa 5 Pages projects trên một repository monorepo.

2. Chuẩn bị GitHub

Khởi tạo repo

cd websites
git init
git add .
git commit -m "Initial static websites"
git branch -M main

Push lên GitHub

git remote add origin https://github.com/YOUR_USERNAME/websites.git
git push -u origin main

3. Deploy site-a

Cloudflare Dashboard → Workers & Pages → Create application → Pages → Import an existing Git repository → chọn repo websites.

Setting	Value
Project name	`site-a`
Production branch	`main`
Root directory	`site-a`
Build command	để trống hoặc `exit 0`
Build output directory	`.`

Nếu site-a chứa output ở dist/, đặt Build output directory = dist.

4. Deploy site-b và site-c

Tạo thêm hai Pages projects nhưng vẫn chọn cùng repository websites.

site-b
  repo: websites
  root: site-b
  output: .

site-c
  repo: websites
  root: site-c
  output: .

GitHub
websites

→

Pages
site-a

Pages
site-b

Pages
site-c

5. Build watch paths

Mặc định một thay đổi bất kỳ trong repo có thể trigger build các Pages projects cùng liên kết repository. Vào Project → Settings → Build → Build watch paths và giới hạn từng project.

site-a

Include paths:
site-a/*

site-b

Include paths:
site-b/*

site-c

Include paths:
site-c/*

Mục tiêu: commit chỉ thay đổi site-b thì chỉ project site-b deploy.

6. Update site

Ví dụ chỉ sửa site-b:

git add site-b
git commit -m "Update site-b contact section"
git push origin main

Cloudflare tự build/deploy site-b. Không upload tay, không Wrangler, không cấu hình DNS lại.

7. Preview bằng feature branch

git checkout -b feature/site-a-new-header
# sửa site-a
git add site-a
git commit -m "New header for site-a"
git push -u origin feature/site-a-new-header

Cloudflare Pages có thể tạo preview deployment cho branch/PR. Sau khi kiểm tra:

git checkout main
git pull
git merge feature/site-a-new-header
git push origin main

8. Custom domain

Project	Pages URL	Domain
`site-a`	`site-a.pages.dev`	`site-a.com`
`site-b`	`site-b.pages.dev`	`site-b.com`
`site-c`	`site-c.pages.dev`	`site-c.com`

Trong từng project: Custom domains → Set up a domain.

9. Giới hạn và mở rộng

Nếu bạn hướng tới 10–50 website, không nên dồn hết vào một repo Pages monorepo vì giới hạn 5 projects/repository. Có thể chia thành websites-group-01, websites-group-02... hoặc chuyển sang CI/CD + Wrangler.

GitHub
├── websites-group-01
│   ├── site-a
│   ├── site-b
│   ├── site-c
│   ├── site-d
│   └── site-e
├── websites-group-02
│   ├── site-f
│   ├── site-g
│   └── ...
└── websites-group-03
    └── ...

Cấu hình khuyến nghị

Repository: websites
Branch: main

site-a:
  root: site-a
  build: blank / exit 0
  output: .
  watch: site-a/*

site-b:
  root: site-b
  build: blank / exit 0
  output: .
  watch: site-b/*

site-c:
  root: site-c
  build: blank / exit 0
  output: .
  watch: site-c/*

Một repo websites, nhiều site, nhiều domain