← C4 Model: vẽ kiến trúc phần mềm

Bài 13 · Nâng cao · 30 phút

Dự án: quy trình tài liệu CEO → DEV

Biên soạn bởi Nguyễn Anh Tuấn

Mở rộng - dự án: dựng quy trình tài liệu trong repo, từ ý tưởng (CEO/Sales) → BA (user story + C4 Context) → PO/PM (backlog) → DEV, docs-as-code + AI.

Hai bài trước cho ta nơi lưu (docs-as-code) và cách dựng nhanh (AI). Bài này ghép tất cả thành một quy trình chạy được: một tính năng đi từ ý tưởng tới code, qua mọi vai trò, để lại dấu vết trong repo.

CEO / SalesNêu ý tưởng & giá trị kinh doanh → đọc sơ đồ Context.
BAViết user story + glossary, cập nhật Context khi phạm vi đổi.
PO / PMƯu tiên backlog, đối chiếu sơ đồ Container để ước lượng.
DEVCập nhật Component, ghi ADR, viết code - tất cả cùng một PR.

Mọi vai trò đọc/ghi vào CÙNG repo, nên không ai làm việc với một bản "sự thật" lỗi thời.

Theo dõi một tính năng đi hết quy trình. Ý tưởng từ Sales: "cho người dùng nạp tiền bằng quét mã QR". Đây là chuỗi artifact để lại trong repo:

  • 1. Glossary: thêm thuật ngữ "Mã QR nạp tiền" để cả công ty hiểu giống nhau.
  • 2. User story (BA): "Là người dùng, tôi muốn nạp tiền bằng quét QR để khỏi nhập số tài khoản".
  • 3. Cập nhật C4: Context hầu như không đổi; Container thêm quan hệ tới dịch vụ QR.
  • 4. ADR (DEV): "Dùng dịch vụ QR của ngân hàng thay vì tự sinh" - kèm hệ quả.
  • 5. Code: DEV hiện thực, cập nhật sơ đồ Component của API trong cùng PR.

docs/ba/user-stories.md (trích) - artifact của bước 2

# Nap tien bang quet QR

La nguoi dung, toi muon nap tien bang quet ma QR
de khoi phai nhap so tai khoan thu cong.

## Tieu chi chap nhan
- Cho rang nguoi dung mo man hinh nap tien,
  Khi quet mot ma QR hop le cua ngan hang lien ket,
  Thi so tien duoc dien san va cho xac nhan.
- Cho rang ma QR het han,
  Khi quet,
  Thi he thong bao "ma da het han" va khong nap.

Sơ đồ Container của ví (artifact bước 3) - chỗ tính năng mới sẽ gắn vào:

Container - bên trong Ví Điện Tử

[Người dùng]

Người dùng

Dùng ví trên điện thoại.

[Container: Next.js]

Cổng Cửa hàng

Web cho chủ cửa hàng.

[Container: Flutter]

Mobile App

Ví trên điện thoại.

[Container: Go]

API Application

Xử lý giao dịch ví.

[Container: PostgreSQL]

Cơ sở dữ liệu

Số dư, giao dịch, người dùng.

[Container: Kafka]

Hàng đợi tin

Xử lý giao dịch bất đồng bộ.

[Hệ thống ngoài]

Hệ thống ngân hàng

Nạp/rút tiền.

Dùng [HTTPS]Gọi [JSON/HTTPS]Gọi [JSON/HTTPS]Đọc/ghi [SQL/TCP]Đẩy giao dịch [Kafka]Nạp/rút [API]

Việc của mèo con

Tự hoàn thiện đủ năm artifact cho tính năng này và "đặt" chúng đúng chỗ trong cấu trúc docs/.

Lặp lại quy trình cho một lĩnh vực khác: tính năng "đặt món theo nhóm" (nhiều người cùng chọn món trong một đơn) của app đặt đồ ăn.

  • Glossary: "Đơn nhóm", "Người tạo đơn", "Thành viên" - định nghĩa rõ.
  • User story: cho cả người tạo đơn và thành viên tham gia.
  • C4: Container có thể thêm quan hệ thời gian thực (cập nhật giỏ hàng chung).
  • Để ý: cùng quy trình, chỉ khác phần tử - đó là điều cần ngấm.

Việc của mèo con

Cho tính năng "đặt món nhóm" đi hết quy trình, để lại artifact trong repo.

Dự án thứ ba: tính năng "cấp chứng chỉ khi học viên hoàn thành khoá" của nền tảng học trực tuyến.

  • User story: "Là học viên, tôi muốn nhận chứng chỉ khi hoàn thành để chứng minh năng lực".
  • C4: thêm một component "Certificate Service" trong API; có thể thêm hệ thống ngoài để gửi/ký chứng chỉ.
  • ADR: chọn cách sinh chứng chỉ (PDF tự sinh hay dịch vụ ngoài) - ghi lại đánh đổi.

Việc của mèo con

Hoàn tất quy trình cho tính năng chứng chỉ; chỉ rõ container/component nào bị ảnh hưởng.

Ở mỗi bước, AI có thể dựng nháp để mèo con kiểm chứng - đúng như bài trước đã học.

  • BA: nhờ AI nháp user story + tiêu chí chấp nhận từ một mô tả ngắn của Sales.
  • Kiến trúc: nhờ AI cập nhật sơ đồ Container/Component khi thêm thành phần.
  • ADR: nhờ AI liệt kê các lựa chọn & đánh đổi để mèo con cân nhắc rồi chốt.
  • Luôn kiểm chứng: AI tăng tốc, nhưng chữ ký cuối là của con người.

Chưa quen AI?

Ghé khoá Lập trình với Claude Code để nắm cách làm việc với trợ lý AI từ số 0.

Mèo con giờ không chỉ vẽ được C4, mà còn đưa nó vào một quy trình thật: tài liệu sống cùng code, AI dựng nháp, và mọi vai trò từ CEO/Sales đến DEV cùng một nguồn sự thật. Đây là thứ giúp cả công ty "nói cùng một ngôn ngữ" về hệ thống.

  • Áp dụng ngay: cho một tính năng thật đi hết quy trình, dù công ty đã có quy trình hay chưa.
  • Bắt đầu nhỏ: một user story + một sơ đồ cập nhật trong một PR, rồi nhân rộng.
  • Giữ kỷ luật kiểm chứng: tài liệu đúng mới đáng tin, và đáng tin mới được dùng.

Đi tiếp trên Mèo Ham Học

C4 giúp mèo con NÓI về kiến trúc và vận hành tài liệu. Muốn THIẾT KẾ phần lõi cho vững, ghé SOLIDClean & Onion Architecture; muốn dùng AI sâu hơn, ghé Claude Code. Chúc mèo con vẽ bản đồ thật đẹp! 🗺️

Câu hỏi thường gặp

Làm một dự án thật trọn vẹn (một tính năng đi hết các vai trò, đủ artifact trong repo) còn giá trị hơn ba dự án nửa vời. Nhưng làm cả ba sẽ cho mèo con thấy quy trình LẶP LẠI giống nhau dù lĩnh vực khác - đó là điều cần ngấm.

Bắt đầu nhỏ với MỘT tính năng: thêm một user story và cập nhật sơ đồ Context trong repo, mở một PR cho cả hai. Không cần đảo lộn cả tổ chức - một vòng nhỏ chạy được rồi nhân rộng dần.

Lúc đầu thêm một chút công viết tài liệu. Nhưng nó tiết kiệm về sau: ít họp giải thích lại, ít hiểu lầm giữa các phòng ban, người mới onboard nhanh. Và với AI dựng nháp, chi phí viết giảm hẳn.

Tài liệu thuộc về cả đội, sống trong repo chung. Mỗi vai trò chịu trách nhiệm phần của mình (BA giữ user story & glossary, kiến trúc/DEV giữ C4 & ADR), nhưng tất cả review chéo qua Pull Request.

C4 giúp mèo con MÔ TẢ và truyền đạt kiến trúc. Muốn THIẾT KẾ phần lõi cho vững, học SOLID và Clean Architecture. Muốn dùng AI sâu hơn, học khoá Claude Code.

Tick những điều em tự tin làm được. Càng lên cao, em càng hiểu sâu.

Tick những điều em tự tin làm được sau khi học bài này. 0/6

Trả lời vài câu để chắc rằng em đã nắm bài.

Câu 1/3 Điểm: 0

Trong quy trình tài liệu CEO → DEV, thứ tự đi của một tính năng hợp lý nhất là gì?

  1. 1

    Dự án 1 - Ví điện tử: tính năng "nạp tiền QR"

    Cho tính năng "nạp tiền bằng quét QR" của ví điện tử đi hết quy trình: glossary (thuật ngữ mới), user story + tiêu chí chấp nhận, cập nhật sơ đồ C4 (Context/Container), một ADR, rồi ghi chú phần code cần đụng.

    Hoàn thành khi: Đủ 5 artifact (glossary, user story, cập nhật C4, ADR, ghi chú code); tất cả "để" trong cấu trúc docs/ đã học.

  2. 2

    Dự án 2 - App đặt đồ ăn: "đặt món nhóm"

    Lặp lại quy trình cho tính năng "đặt món theo nhóm" của app đặt đồ ăn: từ ý tưởng tới các artifact trong repo.

    Hoàn thành khi: Có user story rõ vai trò; cập nhật ít nhất sơ đồ Container; một ADR nếu có quyết định đáng ghi.

  3. 3

    Dự án 3 - Nền tảng học: "chứng chỉ hoàn thành"

    Lặp lại cho tính năng "cấp chứng chỉ khi học viên hoàn thành khoá" của nền tảng học trực tuyến.

    Hoàn thành khi: Đủ user story + tiêu chí chấp nhận; chỉ ra container/component nào bị ảnh hưởng.

  4. 4

    Bản đồ vai trò → artifact

    Lập bảng: mỗi vai trò (CEO/Sales, BA, PO/PM, DEV) TẠO artifact nào và ĐỌC artifact nào trong quy trình.

    Hoàn thành khi: Bảng đủ 4 vai trò; mỗi vai trò có cả phần tạo và phần đọc.

  5. 5

    Tăng tốc bằng AI

    Chọn một bước trong một dự án, nhờ AI dựng nháp artifact đó (user story hoặc sơ đồ), rồi kiểm chứng và chỉnh.

    Hoàn thành khi: Có nháp AI + danh sách ≥2 chỗ mèo con đã sửa sau khi kiểm chứng.

  6. 6

    Phản tư: cùng hiểu, làm xuyên suốt

    Viết một đoạn ngắn: quy trình tài liệu này giúp từ CEO/Sales đến DEV "cùng hiểu" và làm việc xuyên suốt thế nào, so với cách tài liệu rời rạc.

    Hoàn thành khi: Nêu được ≥3 lợi ích cụ thể (vd: một nguồn sự thật, ít hiểu lầm, onboard nhanh, quyết định có vết).