Trải Nghiệm Fix Bug bằng GitHub Copilot khi chỉ có Smartphone trong tay

Chào mọi người,

Hôm nay mình muốn chia sẻ một trải nghiệm khá thú vị và cũng hơi lười 😄

Fix bug khi trong tay chỉ có smartphone, không dùng đến laptop, và để cho GitHub Copilot đảm nhận hết mọi việc.

Phát hiện bug khi không có laptop

Trước tiên mình muốn giới thiệu qua về dự án mình đang làm. Mình đang tham gia vào phát triển một dự án có tên là KnowVi – một nền tảng để mọi người chia sẻ kiến thức và trải nghiệm cá nhân dưới dạng bài viết.

Trên KnowVi có một chức năng là Ủng hộ bài viết. Người đọc thấy bài hay thì có thể bấm ủng hộ, chọn mức ủng hộ trong popup rồi thực hiện thanh toán.

Giao diện popup ủng hộ bài viết

Trong lúc test bằng điện thoại, mình phát hiện ra:

• Modal hiển thị không hết trên màn hình device nhỏ

• Và có vấn đề nhỏ về UI trong luồng xác nhận → thanh toán

Chi tiết lỗi UI thì thật ra không quá quan trọng trong bài này.

Quan trọng là: Hoàn cảnh mình phát hiện bug trong lúc không có laptop bên cạnh, thông thường thì mình sẽ để đó và tối về mở laptop fix sau.

Nhưng lúc này mình nghĩ:

“Thử xem, liệu dùng SmartPhone kết hợp với Github Copilot thì có thể xử lý được bug này luôn không?”

Bắt đầu với Copilot bằng việc mô tả yêu cầu chi tiết

Vậy là mình mở app Github trên smartphone, vào chọn repository của dự án và chọn mode Copilot Agent (Lưu ý cần đăng ký Github Copilot từ trước).

Việc mình làm đơn giản là chỉ nhập mô tả yêu cầu của task cho Github Copilot xử lý với những nội dung như:

• Vấn đề UI đang gặp phải

• Hành vi hiện tại

• Hành vi mong muốn

• Và yêu cầu Copilot xử lý dưới góc độ chuyên gia UI/UX

Dưới đây là prompt mình đã dùng để yêu cầu Copilot

Prompt yêu cầu Copilot

Sau khi bấm submit thì cửa sổ nhập prompt đóng lại và nhảy về trang home luôn, ở trang home mình click mục Agents thì thấy Copilot đã tạo một Pull Request ở trạng thái WIP.

Pull Request lúc này chưa thấy có code change, chỉ thấy nội dung mô tả description của pull khá là chi tiết.

Lúc này mình cũng đang có chút nghi ngờ:

“Không biết là nó xử lý được không, Hay là nó chỉ tạo PR cho có?”

Khi Copilot bắt đầu đẩy commit đầu tiên

Một lúc sau, thấy có thông báo về mail, và mình check đã thấy Copilot bắt đầu push commit đầu tiên.

Khi push commit thì CI/CD trên Vercel (mình đã setup từ trước) tự động chạy.

Và… fail ngay lần đầu ❌

CI/CD fail ngay lần đầu

Lúc này thì mình cũng thấy bình thường vì hầu như lúc vibe-coding thường phải yêu cầu AI sửa nhiều lần mới xong được 1 task, nên có lẽ chắc dùng trên đây cũng vậy thôi😄

Mình không có ý định check nội dung code vì đang dùng smartphone, thay vì thế mình copy trực tiếp error message từ CI/CD và dán vào comment lên PR.

Mình không comment trực tiếp vào dòng code.

Chỉ để lại một comment kiểu:

Đây là lỗi lúc CI/CD chạy build , hãy xử lý giúp tôi.

Không nên phó mặc hoàn toàn cho AI

Và điều đáng buồn là đợi mãi không thấy có phản hồi gì cả 😄

Thôi đành phải lại review code và check xem vấn đề ở đâu.

Vì logic của chức năng này khá đơn giản, nên check qua code của AI làm thì mình cũng thấy được luôn vấn đề, đó việc Copilot tự ý thêm file .eslintrc.json và nó làm ảnh hưởng đến quá trình build ở trên server.

Mình đã comment như này để yêu cầu Copilot sửa lại.

comment mention @copilot

Có 1 điều mình nhận ra là cần phải mention @copilot thì Copilot mới thực sự nhận được yêu cầu qua comment. Vậy nên đó là lý do mà tại sao nãy mình đợi mãi không thấy phải hồi là vậy :))

Lần này mình comment có mention @copilot, và ngay sau khi submit thì Copilot react icon "mắt" vào comment đó luôn, lúc này thì mình biết được là Copilot đã check và bắt đầu xử lý comment của mình rồi. Không phải đoán già đoán non nữa =))

Sau khi comment xong thì đợi tầm 1~2 phút thì đã có commit mới được đẩy lên.

Đúng như mong đợi copilot bỏ file đó, CI/CD chạy lại… và lần này đã pass ✅

Phản hồi của copilot và CI/CD pass

Kết quả và cảm nhận sau cùng

Mình test lại toàn bộ flow trên điện thoại:

• Modal đã hiển thị và scroll được hết trên màn hình nhỏ

• UI chuyển sang màn thanh toán đã được fix đúng mong đợi

Và điều khiến mình thấy “hài lòng” nhất là:

• Không cần dùng laptop

• Không gõ một dòng code nào

• Toàn bộ thao tác chỉ là mô tả, review, và comment

Nói cho đúng thì:

Copilot không thay mình tư duy, định hướng giải pháp. Nhưng nó giúp mình thực thi, viết code, giúp mình tiết kiệm những thao tác như tạo pull, commit, push code.... Nói chung khá là tiện lợi.

Những điều mình rút ra sau trải nghiệm này

Nếu phải đúc kết lại, thì với mình chiêm nghiệm ra 3 điều này:

- Thứ nhất, Copilot làm tốt khi bạn mô tả đúng vấn đề, không phải khi bạn giao phó toàn bộ.

- Thứ hai, cách làm hiệu quả nhất không phải là “để AI tự làm”, mà là coi nó như một teammate junior cần take care đúng lúc, đúng chỗ.

- Thứ ba, PR comment chính là “ngôn ngữ giao tiếp” tốt nhất giữa dev và Copilot trong 1 task

Và cuối cùng, với sự hỗ trợ của AI Agent thì smartphone không còn là rào cản của dev nữa.

⸻

Nếu bạn là dev và từng rơi vào cảnh:

• Phát hiện bug ngoài giờ

• Không có laptop bên cạnh

• Nhưng không muốn để bug đó sang hôm sau

Thì bạn có thể tham khảo trải nghiệm này của mình để có thể giải quyết được vấn đề đó dễ dàng hơn :))

Cảm ơn bạn đã đọc hết bài viết của mình, nếu thấy hữu ích thì cho mình xin 1 lượt yêu thích và chia sẻ bài viết đến mọi người nhé. 🙌