Skip to content

Commit 303fbec

Browse files
authored
feat(demo): update angular standalone (#389)
1 parent fbe5b18 commit 303fbec

37 files changed

+6139
-5707
lines changed

.cursor/rules/angular-default.mdc

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

demo/angular/.eslintrc.json

Lines changed: 0 additions & 51 deletions
This file was deleted.

0 commit comments

Comments
 (0)