Lộ trình cá nhânDeploy Website & Web App Thực Chiến: GitHub Actions CI/CD, Cloudflare, Vercel, Netlify & Custom Domain
8/8

Giáo trình tự học miễn phí · Dịch vụ hỗ trợ theo nhu cầu.

Bài 0835phút ước tínhCơ bản đến Thực chiến

8. Đồ Án Tốt Nghiệp: Xây Dựng Pipeline Tự Động Deploy Toàn Diện Từ Local Repo Lên Production

Đồ án thực chiến cuối khóa: Tự tay đóng gói một Web App hoàn chỉnh, push lên GitHub, kích hoạt CI/CD deploy lên Cloudflare/Vercel, gắn Custom Domain riêng và kiểm toán 100% Uptime.

🏆 Sơ Đồ Quy Trình Nghiệm Thu Đồ Án Tốt Nghiệp

graph TD
A["1. Viết Code / Chỉnh Sửa Tại Local"] --> B["2. Gõ 'git push origin main'"]
B --> C["3. GitHub Actions Tự Động Chạy Unit Test"]
C --> D["4. Vercel / Cloudflare Pages Tự Động Deploy"]
D --> E["5. Web Live Tại Tên Miền Riêng (https://app.yourdomain.com)"]

#### 4 Tiêu Chí Nghiệm Thu Đồ Án:

  1. Tự động hóa 100%: Mọi thay đổi khi push code lên nhánh main phải tự động cập nhật lên web live mà không cần thao tác bằng tay.
  2. Tên miền & SSL: Website chạy trên Custom Domain riêng có chứng chỉ HTTPS hợp lệ.
  3. Bảo mật: Không có bất kỳ API Key hay mật khẩu CSDL nào bị lộ trên mã nguồn công khai.
  4. Hiệu năng & Uptime: Tốc độ tải trang đạt điểm tối ưu trên Google PageSpeed Insights.
example.py
# SCRIPT KIỂM THỬ UPTIME & TỐC ĐỘ PHẢN HỒI WEB APP
import requests
import time

def check_production_health(url: str):
    start = time.time()
    res = requests.get(url, timeout=10)
    latency = round((time.time() - start) * 1000, 2)
    
    if res.status_code == 200:
        print(f"✅ Website {url} hoạt động hoàn hảo!")
        print(f"⚡ Độ trễ phản hồi (Latency): {latency} ms")
    else:
        print(f"❌ Cảnh báo lỗi: Status {res.status_code}")

check_production_health("https://aitinhgon.vn")
Thực hành

Thực hành và tự đánh giá

Hoàn thiện toàn bộ pipeline deploy cho sản phẩm của bạn, nghiệm thu các tiêu chí và xuất bản đường link dự án thực tế.

Cảnh báo & Bắt bệnh

⚠️ Cạm bẫy & Bắt bệnh khi Deploy Website & Web App:

  1. Lỗi 404 khi F5 trang trên Vercel / Cloudflare Pages (Single Page App Routing):
  • Cách khắc phục: Thêm cấu hình rewrites trong vercel.json hoặc tạo file _redirects (/* /index.html 200) cho Cloudflare Pages.
  1. Lỗi rò rỉ API Keys hoặc Secret lên GitHub công khai:
  • Cách khắc phục: Luôn kiểm tra .gitignore trước khi commit và sử dụng GitHub Secrets / Vercel Environment Variables.
Checklist nghiệm thu

📋 Checklist nghiệm thu Pipeline Deploy Production:

  • [ ] Đã liên kết GitHub Repo với Vercel / Cloudflare Pages tự động CI/CD khi git push.
  • [ ] Đã cấu hình Custom Domain riêng và kích hoạt SSL Full (Strict) trên Cloudflare.
  • [ ] Đã thiết lập biến môi trường .env an toàn và ứng dụng đạt tốc độ tải < 0.5s.
⚖️ Bản quyền sở hữu trí tuệ: © 2026 AI Tinh Gọn (aitinhgon.vn) · Giấy phép Creative Commons CC BY-NC-ND 4.0. Cho phép tự học cá nhân, nghiêm cấm thương mại hóa hoặc bán lại. Giáo trình mở →

Tiến độ tự học lưu trên trình duyệt này. Chỉ đánh dấu khi đã kiểm tra sản phẩm thực hành.