Cybozu Vietnam Tech Sharing

Tối ưu hóa quy trình review với Copilot instruction

#AI#copilot#review-code#process#github
Đặng Trung Hiếu
Đặng Trung HiếuNovember 27, 2025
Tối ưu hóa quy trình review với Copilot instruction

Xem nhanh

Xin chào các bạn!!!

Khi các bạn đã làm một developer sẽ phải làm rất nhiều công việc và chắc chắn có một công việc không thể tránh khỏi đó là review code, và chắc là các bạn sẽ đau đầu với công việc này đúng không? Nó có rất nhiều lí do để chúng ta có thể đau đầu ví dụ như là:

  • Mất nhiều thời gian: Đôi lúc mở pull request ra thấy cả chục file, rất nhiều dòng code thay đổi,. Mình phải ngồi xem từng file từng dòng
  • Nhắc đi nhắc lại: Có những vấn đề dev team hoặc developer hay quên nên chúng ta phải nhắc lại nhiều lần
  • Review bị sót: nhiều code quá có thể làm các bạn bị “ngợp” nên dẫn đến review bị sót, có khi lọt bug vào trong phần production
  • Tuổi tác không chừa một ai: Vâng, đôi lúc mình cũng quên mình nên review những gì
  • Rất rất nhiều lí do nữa,…

Vậy câu hỏi đặt ra là có cách nào tối ưu lại giúp chúng ta dễ thở hơn không?

Câu trả lời là có, đó chính là sử dụng Custom instructions để cho Copilot review code trên repository. Hiện tại ở Cybozu cũng đang sử dụng tính năng Custom instructions để tối ưu hóa quy trình phía trên.

Ở bài viết này mình sẽ chỉ nói về tính năng Copilot instructions thôi nhé!!!

Custom instructions/Copilot instructions là gì?

Có thể hiểu một cách đơn giản là một dạng hướng dẫn của chính chúng ta đưa ra bằng ngôn ngữ tự nhiên như cách các developer nói chuyện với nhau để cho Copilot có thể hiểu rõ và làm theo. Thông tin mà mình đưa ra có thể bao gồm như là: cấu trúc dự án, các lệnh run, coding standard,….

Copilot sẽ dựa vào các hướng dẫn mà chúng ta đưa ra để có thể đề xuất code, review,… phù hợp hơn với dự án của chúng ta.

Các bạn hãy tưởng tượng Copilot giống như một member mới vào công ty, bạn sẽ training cho thành viên mới tất cả những gì liên quan đến dự án.

Tính đến thời điểm hiện tại (2025) thì có 4 loại instructions

  • Personal instructions: Áp dụng riêng cho tài khoản personal, tức là repository nào xài được Copilot thì sử dụng được
  • Organization instructions: Áp dụng cho toàn tổ chức (Github organization)
  • Repository instructions: Áp dụng cho một repository cụ thể nào đó mà chúng ta chỉ định
  • Path-specific instructions: Áp dụng cho 1 phần hoặc 1 thư mục nào đó ở trong repository của chúng ta

Ở bài viết này mình sẽ hướng dẫn thực hiện viết custom instructions cho Repository instructions

Các bước cấu hình

Trước khi thực hiện cấu hình thì chúng ta sẽ tạo 1 project nho nhỏ cùng làm với nhau nhé. Cấu trúc project như sau:

counter-demo/
├── src/
│   ├── Counter.tsx          (Code CÓ LỖI)
│   └── Counter.fixed.tsx    (Code ĐÚNG để tham khảo)

File src/Counter.tsx chứa code sai dùng để cho copilot review

Copy 
import React, { useState } from 'react';

// ❌ Lỗi 1: Không có type cho props
export const Counter = ({ initialValue }) => {
  // ❌ Lỗi 2: Sử dụng let thay vì const
  let [count, setCount] = useState(initialValue);
  
  // ❌ Lỗi 3: Sử dụng var
  var step = 1;
  
  // ❌ Lỗi 4: Console.log còn sót
  console.log('Current count:', count);
  
  return (
    <div>
      <h1>Count: {count}</h1>
      {/* ❌ Lỗi 5: Thiếu aria-label */}
      <button onClick={() => setCount(count + step)}>
        +
      </button>
      <button onClick={() => setCount(count - step)}>
        -
      </button>
      {/* ❌ Lỗi 6: Thiếu aria-label */}
      <button onClick={() => setCount(initialValue)}>
        Reset
      </button>
    </div>
  );
};

File src/Counter.fixed.tsx chứa code đúng dùng để so sánh

Copy 
import React, { useState } from 'react';

interface CounterProps {
  initialValue: number;
}

/**
 * Counter component with increment, decrement, and reset functionality
 */
export const Counter: React.FC<CounterProps> = ({ initialValue }) => {
  const [count, setCount] = useState<number>(initialValue);
  
  const STEP = 1;
  
  const handleIncrement = (): void => {
    setCount(count + STEP);
  };
  
  const handleDecrement = (): void => {
    setCount(count - STEP);
  };
  
  const handleReset = (): void => {
    setCount(initialValue);
  };
  
  return (
    <div className="counter">
      <h1>Count: {count}</h1>
      <button 
        onClick={handleIncrement}
        aria-label="Increment counter"
      >
        +
      </button>
      <button 
        onClick={handleDecrement}
        aria-label="Decrement counter"
      >
        -
      </button>
      <button 
        onClick={handleReset}
        aria-label="Reset counter"
      >
        Reset
      </button>
    </div>
  );
};

Bước 1: Tạo file copilot-instructions.md

Các bạn hãy tạo 1 file copilot-instructions.md trong thư mục .github/ ở ngoài root, nó nằm chung với đám github actions. Nếu như các bạn chưa có thư mục này thì có thể tạo nhé.

Cấu trúc của chúng ta sẽ thay đổi như bên dưới:

counter-demo/
├── .github/
│   └── copilot-instructions.md
├── src/
│   ├── Counter.tsx          (Code CÓ LỖI)
│   └── Counter.fixed.tsx    (Code ĐÚNG để tham khảo)

Bước 2: Viết rule và ngữ cảnh

🤔 Ơ vậy bây giờ chúng ta viết cái gì trong file copilot-instructions.md này?

Như mình giới thiệu lúc đầu, file này dùng để hướng dẫn Copilot tương tự như là hướng dẫn cho người mới vào công ty, nên chúng ta sẽ viết những hướng dẫn bằng cách sử dụng ngôn ngữ tự nhiên tương tự như hướng dẫn cho người mới. Bây giờ mình sẽ liệt kê ví dụ những điểm chúng ta cần hướng dẫn

Project Information:

  • React 18+ với TypeScript 5+
  • Functional components + hooks

Typescript:

  • Có định nghĩa types cho props và state
  • Không sử dụng any type
  • Có React.FC hoặc explicit return type

React:

  • Sử dụng functional components
  • Props interface đặt tên theo format ComponentNameProps
  • Dùng const thay vì let hoặc var

Code Style:

  • Không có console.log
  • Buttons có aria-label
  • Tên biến mô tả rõ ràng
  • Functions có JSDoc comment

Common Issues (Lỗi thường gặp)

  • Thiếu types
  • Dùng var hoặc let không cần thiết
  • Thiếu accessibility attributes
  • Console.log còn sót trong code

Bây giờ chúng ta sẽ chuyển những điểm ở trên sang tiếng anh và viết dạng file markdown trong file copilot-instructions.md nhé.

Copy 
# Counter App - Review Rules

## Project Information
- **Project Type**: React + TypeScript Counter Application
- **Tech Stack**: React 18+, TypeScript 5+
- **Component Type**: Functional components with hooks

## TypeScript Rules
- Always define types for props and state
- No `any` type allowed
- Use `React.FC` or explicit return type

## React Rules
- Use functional components only
- Props interface must be named `ComponentNameProps`
- Use `const` instead of `let` or `var`

## Code Style
- Remove all `console.log` statements
- Add aria-labels for buttons
- Use descriptive variable names
- Add JSDoc for functions

## Common Issues
- Missing types
- Using `var` or `let` unnecessarily
- Missing accessibility attributes
- Console.log in production code

Lưu ý khi viết rule

🤔 File instruction có viết dài được không? Dài quá Copilot có bị quên không?

Theo như mình tham khảo trên docs thì số dòng lí tưởng của file instruction là khoảng 300 dòng và tối đa không quá 500 dòng. Nếu như dài quá thì các bạn nên tách ra và link lại nhé.

🤔 Vậy tách và link làm sao?

Các bạn có thể tạo 1 file rule ở bất kì folder nào trên project của mình. Ví dụ như file rule của frontend đặt trong thư mục frontend, file rule của backend đặt trong thư mục backend.

Ví dụ mình có file tên là src/frontend-rules.md. Sau đó mình sẽ link lại vào trong file .github/copilot-instructions.md như ví dụ bên dưới

Copy 
# Frontend
Use the rule in the [frontend-rules.md](../src/frontend-rules.md)

🤔 Tại sao cần phải link?

Khi Copilot bắt đầu làm việc, file đầu tiên nó đọc là .github/copilot-instructions.md. Nếu không link, Copilot sẽ không biết về các file instructions khác. Đặc biệt Copilot trên github web chỉ hỗ trợ file .github/copilot-instructions.md, không đọc các file ở vị trí khác!

Cách sử dụng

Cách sử dụng cực kì đơn giản, ở đây chúng ta sẽ có 2 cách sử dụng chính là sử dụng với chat trong IDE (VS code, PHPstorm,…) và sử dụng với Copilot trên Github web

Cách 1: Sử dụng trong IDE

Bạn chỉ cần kéo thả file cần review vào và chat 1 câu “Hãy review file này đi!!”. Copilot sẽ tự đọc file instructions và review theo nội dung của file.

Sử dụng instructions với Copilot chat trong IDE

Các bạn có thể thấy Copilot tự động sử dụng 1 reference là file instructions mà chúng ta không cần chỉ định!!

Cách 2: Sử dụng trên Github web

Tính năng này chắc các bạn cũng đã sử dụng nhiều đó là Copilot review ở trên pull request!

Để sử dụng tính năng trên thì việc đầu tiên các bạn phải push code dự án mẫu của mình lên trước đã! Sau đó các bạn tạo pull request và request Copilot review

Sử dụng Copilot review trên pull request

Sau khi chờ đợi thì sẽ có kết quả Copilot đã review như bên dưới, khá là dài nên mình chỉ chụp được 1 đoạn thôi.

Copilot review comment

Tổng kết

Công việc review code hiện tại đã được tự động hóa bằng Copilot instructions giúp chúng ta tiết kiệm được khá nhiều thời gian và không cần phải nhớ nhiều thứ như trước nữa, đặc biệt hữu ích cho:

  • Team có nhiều developer
  • Project có quy tắc coding phức tạp
  • Những ai muốn đảm bảo chất lượng code nhất quán
  • Những người "có tuổi" hay quên (như tác giả bài viết 😄)

Nếu các bạn thấy hay hoặc còn cách nào sử dụng với instructions hay hơn thì hãy cùng nhau chia sẻ nhé!!

Cám ơn các bạn đã đọc bài viết của mình!!!

Tham khảo: https://docs.github.com/en/copilot/how-tos/configure-custom-instructions/add-repository-instructions