Hướng dẫn sử dụng

10 tác vụ thường gặp nhất. Mỗi task có code copy-paste được.

1. Thêm project mới (subdomain placeholder)

npm run project:add -- \
  --slug=tools --name="Tools Hub" \
  --tagline-vi="Tiện ích nhỏ" --tagline-en="Small utilities" \
  --desc-vi="..." --desc-en="..." \
  --icon="🛠️" --accent="#3B82F6" \
  --tags="tools" --tech="React,TypeScript" \
  --status=coming_soon --featured=true --order=5

CLI sẽ tự động:

1. Append entry vào src/data/projects.json
2. Run Zod validator
3. Print next steps (CNAME, deploy)

Sau đó commit + push:

git add src/data/projects.json
git commit -m "feat: add tools project"
git push

2. Edit nội dung project hiện có

Mở src/data/projects.json, edit entry cần sửa, save:

git add src/data/projects.json
git commit -m "fix: update mbti description"
git push

3. Thêm entry “Now” timeline

Mở src/data/now.json, prepend entry mới (entries mới nhất ở trên):

{
  "date": "2026-07-01",
  "vi": "Đang viết CLAUDE.md docs.",
  "en": "Writing CLAUDE.md docs.",
  "links": []
}

npm run validate
git add src/data/now.json
git commit -m "docs: add now entry"
git push

4. Thêm skill mới

Mở src/data/skills.json:

{ "name": "Rust", "category": "language" }

Available categories: language, framework, runtime, tool, infra.

5. Đổi màu accent / theme

Mở tailwind.config.mjs:

coral: {
  DEFAULT: "#FF6B81",  // ← đổi màu primary
  400: "#FF7E92",
  500: "#FF6B81",
  600: "#E85A70",
}

6. Đổi text trên hero

Mở src/lib/projects.ts → I18N_STRINGS.vi.hero (và .en.hero):

hero: {
  greeting: "Xin chào, tôi là",
  subtitle: "Developer & Creator. Tôi xây dựng ...",
  ctaPrimary: "Xem dự án",
  ctaSecondary: "MBTI Test →",
  // ...
}

7. Promote project từ “coming_soon” → “live”

Sau khi subdomain đã provisioned + CNAME + SSL ready, sửa src/data/projects.json:

{
  "slug": "tools",
  "status": "live",
  "url": "https://tools.dung87.io.vn",
  "launchedAt": "2026-07-01"
}

npm run validate
git add src/data/projects.json
git commit -m "feat: promote tools to live"
git push

8. Deploy (auto via GH Action)

# Mọi push lên main đều trigger:
# 1. CI workflow: validate + build (upload dist/ artifact)
# 2. Deploy workflow: CI + deploy to Cloudflare Pages

git push
# → Site updated trong ~30s

Verify:

curl -sI https://dung87.io.vn/ | head -1
# Expect: HTTP/2 200

9. Verify tất cả subdomains đang live

npm run healthcheck
# Output:
# ✔ mbti   mbti.dung87.io.vn
#   ✔ CNAME  mbti-app-8em.pages.dev
#   ✔ HTTP   200 (cf-ray ✓)
# ✔ All 1 subdomain(s) healthy.

10. Format code

npm run format    # Prettier auto-fix

Available scripts

Command	Purpose
npm run dev	Dev server tại http://localhost:4321
npm run build	Production build → dist/
npm run preview	Serve dist/ local tại http://localhost:4322
npm run validate	Zod check trên src/data/*.json
npm run project:add -- --slug=...	Thêm project mới
npm run healthcheck	Probe DNS + HTTP cho live subdomains
npm run check:claude-md	Sanity check: mọi project phải có trong CLAUDE.md
npm run lint	validate + check-claude-md
npm run format	Prettier auto-format

Deploy flow

git push
   ↓
GitHub Actions: CI workflow
   ├─ npm ci
   ├─ npm run validate
   ├─ npm run check:claude-md
   └─ npm run build → dist/ artifact
   ↓
GitHub Actions: Deploy workflow
   ├─ (CI again)
   └─ cloudflare/pages-action@v1 → Cloudflare Pages project
   ↓
https://dung87.io.vn/ updated (~30s)

Next steps

• Cài đặt đầy đủ → — troubleshooting chi tiết
• Thêm subdomain mới → — 10 bước
• Design system → — tokens, recipes