Lesson 11: Custom Instructions — Teach AI according to your coding style

Vibe Coding with GitHub Copilot: From Basics to Advanced

Part 4: Customize & Extend Copilot

xdev.asia

1. What are Custom Instructions?

Custom Instructions are the static rules that you write for Copilot to automatically apply to every interaction in project. Instead of having to repeat conventions every time you prompt, you write it once and Copilot follows it.

Không có instructions:
  Prompt: "Create a function to validate email"
  → AI dùng style riêng, có thể khác conventions của bạn

Có instructions:
  Prompt: "Create a function to validate email"
  → AI tự động tuân theo: TypeScript strict, Zod validation,
    custom error class, JSDoc comments, đặt tên theo camelCase

2. Types of Custom Instructions

2.1. Project-level: .github/copilot-instructions.md

Apply for entire project, shared via Git with the whole team:

# Project Coding Guidelines

## Tech Stack
- Next.js 15 with App Router
- TypeScript 5.x (strict mode)
- Prisma ORM with PostgreSQL
- NextAuth v5 for authentication
- Zod for validation
- TailwindCSS for styling

## Code Style
- Use functional components with arrow functions
- Prefer `const` over `let`, never use `var`
- Use TypeScript strict mode, no `any` type
- Use named exports, not default exports
- Error handling with custom AppError class

## Naming Conventions
- Files: kebab-case (user-service.ts)
- Components: PascalCase (UserProfile.tsx)
- Functions/variables: camelCase
- Constants: UPPER_SNAKE_CASE
- Database tables: snake_case
- API routes: kebab-case (/api/user-profiles)

## Testing
- Use Vitest for unit tests
- Test files alongside source: `*.test.ts`
- Use describe/it blocks with clear descriptions
- Mock external dependencies, not internal modules

## API Conventions
- RESTful endpoints with proper HTTP methods
- Response format: { data, error, meta }
- Pagination: cursor-based with `nextCursor`
- Error responses: { error: { code, message, details } }

## Git
- Conventional commits: feat|fix|docs|refactor|test(scope): message
- Branch names: feature/xxx, fix/xxx, docs/xxx

2.2. File-type specific: .instructions.md

Apply for specific file types based on applyTo pattern:

<!-- .github/instructions/react-components.instructions.md -->
---
applyTo: "src/components/**/*.tsx"
---
# React Component Guidelines

- Use arrow function components
- Props interface named `{ComponentName}Props`
- Destructure props in function parameter
- Use `cn()` utility for conditional classNames
- Memoize with React.memo only when necessary
- Extract hooks logic to custom hooks in src/hooks/

<!-- .github/instructions/api-routes.instructions.md -->
---
applyTo: "src/app/api/**/*.ts"
---
# API Route Guidelines

- Always validate request body with Zod
- Use try-catch with AppError for error handling
- Return proper HTTP status codes
- Include rate limiting middleware
- Log all requests with structured logging

2.3. User-level instructions

Apply for every project on your computer (VS Code Settings):

{
  "github.copilot.chat.codeGeneration.instructions": [
    { "text": "Always use TypeScript, never plain JavaScript" },
    { "text": "Prefer functional programming patterns" },
    { "text": "Include error handling in every function" }
  ]
}

3. Use /init to automatically create Instructions

Instead of writing from scratch, run /init in Chat view:

1. Copilot scans the entire codebase
2. Detect patterns, conventions, tech stack
3. Create .github/copilot-instructions.md based on current code
4. You review and adjust

// Trong Chat view:
/init

// Copilot output:
"I've analyzed your codebase and created .github/copilot-instructions.md
with the following conventions detected:
- Next.js 15 App Router with TypeScript
- Prisma ORM patterns...
- Testing with Vitest...
Please review and adjust as needed."

4. Structure Instructions effectively

✅ DO:

• Short and specific: "Use Zod for validation" is better than "Make sure to validate properly"
• Actionable rules: AI can follow immediately
• Reference files: "Follow pattern in src/services/UserService.ts"
• Divide by section: Style, Testing, API, Git

❌ DON'T:

• Too long: > 2000 words wastes context window
• Too general: "Write clean code" — AI doesn't know what "clean" means in your context
• Contradictory: "Use classes" + "Use functional programming"
• Outdated: instructions do not match the current code

5. Instructions for Team

When working as a team, commit .github/copilot-instructions.md go to the repo:

project/
├── .github/
│   ├── copilot-instructions.md      ← Main instructions
│   ├── instructions/
│   │   ├── react.instructions.md    ← React-specific
│   │   ├── api.instructions.md      ← API-specific
│   │   └── testing.instructions.md  ← Testing-specific
│   ├── prompts/
│   │   ├── new-feature.prompt.md    ← Prompt templates
│   │   └── code-review.prompt.md
│   └── agents/
│       └── Reviewer.agent.md        ← Custom agents

When every member uses Copilot, all receive the same instructions → more consistent code.

6. Practice exercises

1. Run /init in the current project
2. Review the generated instructions file
3. Additional: naming conventions, error handling strategy, testing approach
4. Create one .instructions.md for specific file-type (components or API)
5. Test: prompt to create code → see if AI follows instructions

7. Summary

Type	File	Scope
Project-level	.github/copilot-instructions.md	Entire project, shared via Git
File-type	.github/instructions/*.instructions.md	Specific file patterns (applyTo)
User-level	VS Code Settings	Every project on the device

Custom Instructions are One-time investment Helps every subsequent prompt give better results. The next song will be a cover Custom Agents & Agent Skills — create specialized AI for each task.