Dựng app biểu đồ kiểm soát bằng Claude (từ dòng lệnh đến web app)

Từ một yêu cầu 3 dòng đến web app phát hiện bất thường trong dữ liệu

Bạn có file Excel ghi doanh số, lỗi đóng gói, hàng trả… mỗi ngày. Bạn muốn biết hôm nào con số "lạ" để điều tra, thay vì ngồi kéo thanh cuộn mỏi mắt. Bạn không phải lập trình viên, không muốn thuê dev cho một việc nhỏ.

Claude Code – trợ lý viết code của Anthropic, chạy ngay trong dòng lệnh – có thể nhận yêu cầu bằng tiếng Việt đời thường, tự viết app Python, sinh biểu đồ kiểm soát (control chart), xuất Excel và nâng cấp thành web app chạy trên máy bạn. Toàn bộ quy trình bạn sẽ đọc trong bài này: từ chuẩn bị môi trường, viết yêu cầu, trả lời câu hỏi của AI, chạy thử, cho đến lúc có một web app nhỏ để mở trong trình duyệt.

Điểm khác biệt so với các hướng dẫn control chart trên mạng: bạn không cần cài Minitab, không cần biết Shewhart là ai, không cần tự gõ từng dòng Python. Bạn đọc, bạn ra yêu cầu, AI lo phần còn lại – bạn vẫn kiểm soát kết quả.

Biểu đồ kiểm soát giúp bạn "nhìn" bất thường như thế nào

Biểu đồ kiểm soát (control chart – tiếng Anh là control chart, cũng gọi là biểu đồ Shewhart) là cách vẽ một con số theo thời gian, kèm hai đường ngưỡng trên và ngưỡng dưới. Hình dung như đo nhiệt độ cơ thể mỗi ngày: bình thường dao động quanh 37°C, nhưng nếu hôm nào vọt lên 39°C thì bạn biết ngay có chuyện. Biểu đồ kiểm soát làm đúng một việc như vậy cho dữ liệu vận hành: vạch ra ngưỡng bình thường, rồi gọi tên những ngày "vọt" ra ngoài.

Trong ngôn ngữ Six Sigma (một bộ phương pháp quản lý chất lượng phổ biến trong sản xuất), người ta chia nguyên nhân thành hai nhóm. Nguyên nhân ngẫu nhiên (common cause) là những dao động tự nhiên, ai cũng gặp – ví dụ hôm nay bán được 50 đơn, mai 48 đơn, không có gì lạ. Nguyên nhân đặc biệt (special cause) là thứ khiến con số nhảy bất thường – website sập, đối tác giao hàng trễ, có chiến dịch khuyến mãi… Biểu đồ kiểm soát giúp bạn tách hai nhóm này ra, thay vì đoán mò.

Quy tắc cổ điển là 3-sigma: lấy đường trung bình, cộng và trừ ba lần độ lệch chuẩn (độ lệch chuẩn là thước đo mức "dao động bình thường" của dữ liệu – dữ liệu càng nhảy nhiều thì độ lệch chuẩn càng lớn). Điểm nào rơi ngoài hai đường này được đánh dấu đỏ, gọi là out-of-control. Ngoài ra còn bộ quy tắc Western Electric (bộ quy tắc mở rộng, kiểm tra cả các mẫu điểm chạy về một phía) – cả hai bộ đều hợp lệ, tùy mức độ nghiêm ngặt bạn cần.

Biểu đồ kiểm soát không phải để "đẹp" – nó để bạn nhận ra ngày nào đáng điều tra, thay vì ngày nào chỉ là dao động bình thường.

Để so sánh với cách làm đa biến (nhiều cột dữ liệu cùng lúc) dùng Isolation Forest, bạn có thể đọc thêm bài phát hiện bất thường đa biến với Isolation Forest trong Excel. Cách làm ở đó phức tạp hơn, phù hợp khi bạn có hàng chục cột dữ liệu cần theo dõi cùng lúc. Bài này đi theo hướng đơn giản: một chỉ số, một biểu đồ, một nút bấm.

Chuẩn bị môi trường: hai cách dùng Claude Code

Claude Code là phiên bản dòng lệnh (CLI – chương trình chạy trong cửa sổ Terminal/Command Prompt) của Claude, thiết kế để đọc và viết file trong thư mục làm việc của bạn. Bạn chat với nó bằng tiếng Việt, nó tự sinh code và lưu file vào đúng chỗ. Có hai cách tiếp cận phổ biến:

• Cloud trực tiếp: bạn mở Terminal, gõ claude, đăng nhập tài khoản Anthropic (công ty tạo ra Claude), bắt đầu chat. Không cần IDE (phần mềm soạn code như VS Code), phù hợp khi bạn chỉ cần sinh file nhanh rồi đóng lại.
• Qua Cursor: cài Cursor (một IDE có tích hợp sẵn AI), bật chế độ Claude làm backend. Bạn vừa chat vừa thấy file sinh ra ngay trong cây thư mục. Phù hợp khi bạn muốn chỉnh sửa code sau đó hoặc muốn lưu trữ toàn bộ project trên máy.

Giá Claude Code và Cursor năm 2025–2026 thay đổi theo gói và theo thời điểm, bạn nên kiểm tra trang chính hãng trước khi mua. Cursor có bản miễn phí giới hạn, bản Pro và Business; Claude Code tính theo lượng token (token là đơn vị đo lượng chữ AI xử lý – càng viết nhiều file dài thì càng tốn token) qua API hoặc đi kèm gói Claude Pro/Max. Khi bạn chỉ cần sinh một app nhỏ như control chart, chi phí thường rất thấp so với thuê dev.

Viết yêu cầu 3 dòng, tạo thư mục, cấp quyền có chủ đích

Đừng viết yêu cầu dài. Ba dòng là đủ cho một app control chart:

Dòng 1 – mục tiêu: "Tôi cần một app Python đọc file CSV/Excel cột ngày và cột giá trị, vẽ biểu đồ kiểm soát với đường trung bình và ngưỡng 3-sigma, tô đỏ các điểm out-of-control."

Dòng 2 – đầu vào/ra: "Cho phép tôi upload file từ giao diện web, xuất biểu đồ thành ảnh PNG và xuất danh sách điểm bất thường ra Excel."

Dòng 3 – công nghệ: "Dùng Flask hoặc Streamlit để chạy web app cục bộ, có file requirements.txt để cài đặt."

Sau đó bạn tạo một thư mục riêng, ví dụ control-chart, mở nó trong Cursor hoặc Terminal, rồi dán yêu cầu vào. Claude Code sẽ hỏi bạn cấp quyền gì – đây là điểm quan trọng: bạn cấp quyền có chủ đích, không bật auto-accept (tự động đồng ý mọi thao tác). Lý do: AI có thể đề xuất cài thêm thư viện, sửa file ngoài thư mục, chạy lệnh hệ thống – bạn muốn duyệt từng bước một, nhất là khi mới bắt đầu.

Quy trình gọi là "trust workspace" – bạn đánh dấu thư mục này là đáng tin, AI được phép đọc/ghi trong đó, nhưng vẫn hỏi trước khi chạy lệnh lạ. Hướng dẫn cập nhật theo UI mới nhất có trong bài phân tích dữ liệu không cần viết prompt dài với Plugin Data; nếu bạn dùng Plugin Data của Claude để phân tích nhanh trước khi đi sâu vào control chart, đọc thêm sẽ giúp bạn hình dung quy trình cấp quyền tương tự.

Trả lời câu hỏi của Claude – đừng để AI đoán

Claude Code hiếm khi code ngay. Nó thường hỏi lại vài câu kiểu "clarifying questions" (câu hỏi làm rõ) trước khi viết. Đây không phải phiền phức mà là cơ hội để bạn định hình app cho đúng nhu cầu. Bốn câu hỏi thường gặp:

• Tần suất đo: ngày, tuần, hay tháng? Nếu dữ liệu của bạn là doanh số mỗi ngày thì nói rõ; nếu là số lỗi mỗi ca sản xuất thì khác. Tần suất ảnh hưởng đến cách tính đường trung bình.
• Quy tắc phát hiện: chỉ 3-sigma, hay thêm Western Electric? Bạn mới bắt đầu thì 3-sigma đủ; khi cần nghiêm ngặt hơn thì thêm bộ quy tắc mở rộng.
• Framework web: Flask hay Streamlit? Flask cho bạn toàn quyền thiết kế giao diện HTML, hơi tốn công. Streamlit cho phép dựng giao diện bằng Python thuần, phù hợp app nội bộ nhanh.
• Nguồn dữ liệu mẫu: bạn có file Excel sẵn chưa, hay muốn Claude sinh dữ liệu giả để chạy thử? Sinh dữ liệu mẫu là cách tốt nhất để kiểm tra app trước khi gắn vào dữ liệu thật.

Bạn trả lời thẳng, không cần văn vẻ. "Dữ liệu ngày, quy tắc 3-sigma, dùng Streamlit, sinh dữ liệu mẫu 60 ngày cho tôi chạy thử." Claude sẽ gật đầu và bắt đầu viết file.

AI đoán giùm bạn tốt nhất cũng chỉ bằng 70% ý bạn. Mấy câu hỏi nó hỏi lại chính là chỗ bạn nâng 70% đó lên 100%.

Chạy thử app Python – file controlchart.py

Sau khi bạn trả lời, Claude sinh ra một loạt file trong thư mục. Cấu trúc điển hình:

• controlchart.py – file chính, chứa logic đọc dữ liệu, tính trung bình, độ lệch chuẩn, vẽ biểu đồ bằng matplotlib (thư viện Python phổ biến để vẽ đồ thị).
• sample_data.csv – dữ liệu mẫu 60 dòng, có cả vài điểm "cố tình" nằm ngoài ngưỡng để bạn kiểm tra app có phát hiện được không.
• requirements.txt – danh sách thư viện cần cài (pandas, matplotlib, numpy, openpyxl…).

Bạn chạy thử bằng hai lệnh: pip install -r requirements.txt (cài thư viện) rồi python controlchart.py (chạy app). Nếu dùng Streamlit thì lệnh cuối là streamlit run controlchart.py và trình duyệt tự mở localhost (cổng mạng nội bộ trên máy bạn, ví dụ http://localhost:8501).

Kết quả bạn thấy: biểu đồ đường, đường giữa là trung bình, hai đường ngưỡng trên/dưới, các điểm out-of-control được tô đỏ. Cùng với đó là file Excel mới out_of_control_points.xlsx liệt kê ngày, giá trị, lý do bị đánh dấu (vượt trên hay vượt dưới).

Nâng cấp lên web app bằng Flask hoặc Streamlit

Chạy app Python trong Terminal tiện, nhưng đưa cho đồng nghiệp dùng thì phải có giao diện web. Đây là lúc Claude Code tỏa sáng: bạn chỉ cần nói "nâng cấp thành web app, có nút upload file, hiển thị biểu đồ trực tiếp trên trang".

Với Flask, Claude sẽ sinh thêm app.py chứa route (đường dẫn URL trong web app) để nhận file upload, xử lý, trả về HTML có nhúng ảnh biểu đồ. Giao diện mặc định đơn giản, nhưng bạn có thể yêu cầu thêm bảng danh sách điểm bất thường ngay dưới biểu đồ, có nút tải Excel.

Với Streamlit, công việc nhẹ hơn nhiều. Bạn chỉ cần vài dòng st.file_uploader, st.pyplot là có giao diện đẹp. Đổi lại, bạn ít kiểm soát HTML/CSS hơn. Với app control chart nội bộ, Streamlit thường đủ dùng và nhanh hơn Flask rất nhiều.

Cả hai đều chạy trên máy bạn (localhost), không cần đẩy lên server. Muốn đồng nghiệp truy cập, bạn có thể triển khai lên Render, Railway hoặc máy chủ nội bộ. Với team nhỏ 5–10 người, chạy localhost trên một máy ai đó là đủ.

Mẹo chụp ảnh màn hình và sinh tài liệu đặc tả

Khi app đã chạy được, bạn nên chụp vài ảnh màn hình: giao diện upload, biểu đồ với điểm đỏ, bảng kết quả. Lưu vào thư mục /docs/screenshots. Mục đích không phải để "khoe" mà để hai việc sau:

• Reverse-engineer (dịch ngược): đưa ảnh kèm câu hỏi cho Claude: "Dựa trên giao diện này, hãy viết lại code HTML/CSS giao diện cho đẹp hơn". AI đọc ảnh và sinh code khớp với ý bạn hơn là bạn tả bằng lời.
• Tài liệu đặc tả Markdown 8 vùng: yêu cầu Claude sinh file requirements.md với 8 phần: mục tiêu, đối tượng dùng, luồng người dùng, yêu cầu chức năng, yêu cầu phi chức năng, ràng buộc kỹ thuật, tiêu chí nghiệm thu, lịch sử thay đổi. File này là "bản đồ" để bất kỳ ai (kể cả bạn sau 3 tháng) mở ra hiểu app làm gì, không cần đọc code.

Bạn có thể tái sử dụng format 8 vùng này cho bất kỳ project Claude Code nào. Đây là lý do bài cách tự tạo skill trong Claude đáng đọc: khi bạn gom tài liệu đặc tả thành một "skill" (kỹ năng tái sử dụng), bạn chỉ cần gọi /requirements-doc là Claude tự sinh đúng format 8 vùng, không phải nhắc lại.

Chuyển sang Cursor để lưu trữ và triển khai cục bộ

App chạy ngon rồi, bạn muốn lưu lại để dùng lâu dài hoặc chia sẻ với team. Hai lựa chọn:

• Lưu trên Cursor: mở thư mục control-chart trong Cursor, toàn bộ file hiện ra. Bạn commit (lưu phiên bản) lên GitHub (dịch vụ lưu trữ code phổ biến) nếu cần backup. Cursor lưu trên máy bạn, không phụ thuộc cloud.
• Đẩy sang máy khác: copy thư mục sang máy đồng nghiệp, chạy lại pip install và streamlit run là xong. Toàn bộ logic nằm trong vài chục dòng code, dễ mang đi.

Nếu bạn đang muốn mở rộng – thêm nhiều chỉ số cùng lúc, hoặc chạy nhiều app song song – đọc bài mô hình chạy song song nhiều agent trong Claude Code sẽ giúp bạn hình dung cách phân tách task: một agent lo control chart, một agent lo dashboard tổng, một agent lo báo cáo email.

Checklist áp dụng và khi nào cần chuyên gia

Tóm lại, để dựng một app control chart bằng Claude Code, bạn đi theo các bước:

• Xác định một chỉ số vận hành bạn muốn theo dõi (doanh số, lỗi, hàng trả…).
• Chuẩn bị dữ liệu dạng bảng: cột ngày, cột giá trị. Lưu CSV hoặc Excel.
• Chọn môi trường: Cloud qua Terminal, hoặc qua Cursor để tiện chỉnh sửa.
• Viết yêu cầu 3 dòng, dán vào Claude Code, trả lời các câu hỏi làm rõ.
• Cấp quyền có chủ đích, không bật auto-accept.
• Chạy thử với dữ liệu mẫu, kiểm tra biểu đồ và file Excel xuất ra.
• Nâng cấp thành web app bằng Flask hoặc Streamlit, thêm nút upload.
• Sinh tài liệu đặc tả Markdown 8 vùng, chụp ảnh màn hình.
• Lưu trữ trên Cursor hoặc copy sang máy khác để dùng tiếp.

Khi nào bạn nên nhờ chuyên gia lĩnh vực (không phải dev)? Khi bạn cần xác định ngưỡng bất thường phù hợp với ngành – ví dụ trong sản xuất chip, tỷ lệ lỗi 0.5% đã là nghiêm trọng; trong dịch vụ khách hàng, tỷ lệ hàng trả 5% có thể bình thường. Biểu đồ kiểm soát phát hiện điểm bất thường, nhưng "bất thường có ý nghĩa gì" vẫn cần người hiểu ngành phán. Claude Code giúp bạn dựng công cụ; chuyên gia giúp bạn đặt câu hỏi đúng.

Nếu bạn muốn mở rộng sang phân tích đa biến – nhiều cột dữ liệu cùng lúc, kiểu như "phát hiện đơn hàng bất thường khi khách hàng, khu vực, và sản phẩm đều lạ" – bạn có thể kết hợp control chart ở đây với Isolation Forest trong bài đã nói ở trên. Hai cách làm bổ sung cho nhau: control chart cho một chỉ số theo thời gian, Isolation Forest cho nhiều chỉ số trên cùng một bản ghi.

Quan trọng nhất: bạn không cần chờ đến lúc "biết lập trình đủ". Ba dòng yêu cầu, một thư mục, vài phút trò chuyện với AI là bạn đã có một app chạy được trên máy. Phần còn lại là bạn ra quyết định dựa trên biểu đồ nó sinh ra.