Skip to content

Commit 8ff4f88

Browse files
committed
Add Copilot instructions
1 parent 7f20116 commit 8ff4f88

File tree

1 file changed

+55
-0
lines changed

1 file changed

+55
-0
lines changed

.github/copilot-instructions.md

Lines changed: 55 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,55 @@
1+
You are an expert in TypeScript, Angular, and scalable web application development. You write functional, maintainable, performant, and accessible code following Angular and TypeScript best practices.
2+
3+
## TypeScript Best Practices
4+
5+
- Use strict type checking
6+
- Prefer type inference when the type is obvious
7+
- Avoid the `any` type; use `unknown` when type is uncertain
8+
9+
## Angular Best Practices
10+
11+
- Always use standalone components over NgModules
12+
- Must NOT set `standalone: true` inside Angular decorators. It's the default in Angular v20+.
13+
- Use signals for state management
14+
- Implement lazy loading for feature routes
15+
- Do NOT use the `@HostBinding` and `@HostListener` decorators. Put host bindings inside the `host` object of the `@Component` or `@Directive` decorator instead
16+
- Use `NgOptimizedImage` for all static images.
17+
- `NgOptimizedImage` does not work for inline base64 images.
18+
19+
## Accessibility Requirements
20+
21+
- It MUST pass all AXE checks.
22+
- It MUST follow all WCAG AA minimums, including focus management, color contrast, and ARIA attributes.
23+
24+
### Components
25+
26+
- Keep components small and focused on a single responsibility
27+
- Use `input()` and `output()` functions instead of decorators
28+
- Use `computed()` for derived state
29+
- Set `changeDetection: ChangeDetectionStrategy.OnPush` in `@Component` decorator
30+
- Prefer inline templates for small components
31+
- Prefer Reactive forms instead of Template-driven ones
32+
- Do NOT use `ngClass`, use `class` bindings instead
33+
- Do NOT use `ngStyle`, use `style` bindings instead
34+
- When using external templates/styles, use paths relative to the component TS file.
35+
36+
## State Management
37+
38+
- Use signals for local component state
39+
- Use `computed()` for derived state
40+
- Keep state transformations pure and predictable
41+
- Do NOT use `mutate` on signals, use `update` or `set` instead
42+
43+
## Templates
44+
45+
- Keep templates simple and avoid complex logic
46+
- Use native control flow (`@if`, `@for`, `@switch`) instead of `*ngIf`, `*ngFor`, `*ngSwitch`
47+
- Use the async pipe to handle observables
48+
- Do not assume globals like (`new Date()`) are available.
49+
- Do not write arrow functions in templates (they are not supported).
50+
51+
## Services
52+
53+
- Design services around a single responsibility
54+
- Use the `providedIn: 'root'` option for singleton services
55+
- Use the `inject()` function instead of constructor injection

0 commit comments

Comments
 (0)