Bài 10: Prompt Patterns nâng cao — Slash Commands, Participants & Variables

Vibe Coding với GitHub Copilot: Từ Cơ bản đến Nâng cao

Phần 3: Prompt Engineering cho Code

xdev.asia

1. Slash Commands

Slash commands là shortcuts cho các tasks thường gặp. Gõ / trong chat để xem danh sách:

Command	Chức năng	Ví dụ
/init	Khởi tạo custom instructions cho project	/init (phân tích codebase và tạo copilot-instructions.md)
/fix	Fix code hoặc error hiện tại	/fix TypeError: Cannot read property 'id' of undefined
/tests	Generate unit tests cho code	/tests for the UserService class
/doc	Generate documentation	/doc for all exported functions in this file
/explain	Giải thích code	/explain #selection
/clear	Clear chat history	/clear

1.1. /init — Setup AI cho project

Slash command quan trọng nhất! Chạy /init khi bắt đầu dùng Copilot cho project:

// Trong Chat view, gõ:
/init

// Copilot phân tích codebase và tạo:
// .github/copilot-instructions.md với:
// - Project structure description
// - Tech stack
// - Coding conventions phát hiện từ codebase
// - Testing patterns
// - Naming conventions

1.2. /fix — Sửa lỗi nhanh

// Copy error từ terminal hoặc Problems panel:
/fix npm ERR! Could not resolve dependency:
npm ERR! peer react@"^17.0.0" from [email protected]

1.3. /tests — Generate tests tự động

// Mở file cần test, rồi:
/tests for all public methods, include edge cases and error scenarios.
Use Jest with describe/it blocks.

2. Chat Participants

Chat participants (bắt đầu bằng @) là các "chuyên gia" cho domain cụ thể:

Participant	Chuyên môn	Khi nào dùng
@workspace	Hiểu toàn bộ codebase	Hỏi về project structure, tìm code liên quan
@terminal	Terminal commands	Giải thích command, fix terminal errors
@vscode	VS Code features	Hỏi về settings, shortcuts, extensions

2.1. @workspace — Codebase expert

@workspace Where is the database connection configured in this project?
@workspace How is error handling done across API routes? Show me the pattern.
@workspace What testing framework and patterns are used? Show examples.

2.2. @terminal — Terminal helper

@terminal How to find all processes using port 3000 and kill them?
@terminal Explain this command: find . -name "*.ts" -exec grep -l "TODO" {} ;
@terminal The last command failed with permission denied. How to fix?

2.3. @vscode — IDE expert

@vscode How to configure auto-format on save for TypeScript files?
@vscode What's the shortcut to split editor vertically?
@vscode How to create a launch.json for debugging Node.js?

3. Combining Patterns — Sức mạnh thực sự

Kết hợp slash commands, participants, và context variables cho prompts mạnh mẽ:

Pattern 1: Fix + Context

/fix #terminalLastCommand
Look at #file:src/services/OrderService.ts and fix the failing test.
The error seems related to the mock setup.

Pattern 2: Tests + File reference

/tests for #file:src/utils/validation.ts
Follow the same pattern as #file:tests/utils/string.test.ts
Include these scenarios: empty input, null, unicode, SQL injection attempts

Pattern 3: Workspace search + Implementation

@workspace Find all API endpoints that don't have rate limiting.
Then add rate limiting middleware to each one, using the same
configuration as #file:src/middleware/rateLimit.ts

4. Xây dựng Prompt Library cá nhân

Tạo collection các prompt templates hay dùng:

4.1. Lưu prompt files trong project

Tạo folder .github/prompts/ với các file .prompt.md:

<!-- .github/prompts/new-api-endpoint.prompt.md -->
---
description: Create a new REST API endpoint
---
Create a new API endpoint for {{resource_name}}.

Requirements:
- CRUD operations (GET list, GET by id, POST, PUT, DELETE)
- Zod validation for request bodies
- Prisma queries following our repository pattern
- Error handling with our AppError class
- Authentication middleware on all routes
- Pagination for list endpoint (cursor-based)

Follow patterns in:
- Route: src/routes/userRoutes.ts
- Service: src/services/UserService.ts
- Schema: src/schemas/userSchema.ts

4.2. Sử dụng prompt files

Trong Chat, reference prompt file:

#file:.github/prompts/new-api-endpoint.prompt.md
resource_name = "products"

5. Advanced Techniques

5.1. Negative prompting

Create a user registration form.
DO NOT:
- Use any CSS framework (no Tailwind, no Bootstrap)
- Add client-side validation (we handle it server-side)
- Include social login buttons
- Use any external dependencies

5.2. Output specification

Generate a database migration for adding an "orders" table.
Output format:

Prisma schema addition (for schema.prisma)
SQL migration file (for manual review)
Seed data TypeScript file (5 sample records)

5.3. Comparative analysis

I need a caching solution for our API responses.
Compare these approaches with code examples for each:
1. In-memory cache (node-cache)
2. Redis cache
3. HTTP cache headers
For each, show: setup code, cache hit/miss handling,
cache invalidation strategy. Recommend which to use
for our use case: 100 RPS, data changes every 5 minutes.

6. Tổng kết

Tool	Prefix	Best for
Slash Commands	/	Quick actions: fix, test, doc, init
Chat Participants	@	Domain expertise: workspace, terminal, vscode
Context Variables	#	Attach specific context: file, selection, codebase
Prompt Files	.prompt.md	Reusable templates cho tasks lặp lại

Kết hợp tất cả lại, bạn có một prompt toolkit đầy đủ để Vibe Coding hiệu quả. Từ Phần 4, chúng ta sẽ tùy chỉnh và mở rộng khả năng của Copilot với Custom Instructions, Custom Agents, và MCP Servers.