michsindlinger/specwright/templates/skills/frontend/angular
specwright/templates/skills/frontend/angular/SKILL.md
Angular frontend development patterns for [PROJECT_NAME]
$ install --global
skillsauthnpx skillsauth add michsindlinger/specwright specwright/templates/skills/frontend/angularInstall this skill globally with one command. Works with Claude Code, Cursor, and Windsurf.
Security Scan Results
3 of 9 scanners reported clean
Some scanners were skipped, did not run, or reported a non-clean status. Review each row below.
3
Scanners Passed
9
Scanners in report
Clean
TrivyContainer and dependency vulnerability scanner
95%
Clean
SemgrepStatic code analysis for vulnerabilities
95%
Clean
mcp-scan (Snyk)Model Context Protocol security validation
95%
Skipped
Snyk (dep)Open source security scanning
50%
Skipped
Socket.devSupply chain security analysis
50%
Skipped
VirusTotalMulti-engine malware detection
50%
Skipped
CrowdStrikeAdvanced threat intelligence
50%
Skipped
OSV-ScannerOpen Source Vulnerability database check
50%
Skipped
OWASP Dep-Check
50%
Last scanned: Apr 17, 2026, 9:30 AM5.3s6 files scanned
SKILL.md
- description:
- Angular frontend development patterns for [PROJECT_NAME]
- alwaysApply:
- false
Angular Frontend Skill
Project: [PROJECT_NAME] Framework: Angular [VERSION] Generated: [DATE]
Quick Reference
Components
- Smart vs Dumb: Container components handle logic, presentational components are pure
- Change Detection: Use
OnPushby default for better performance - Signals: Prefer signals over BehaviorSubject for reactive state (Angular 16+)
State Management
- Local State: Use signals or component properties
- Shared State: Use services with signals or NgRx/Signals Store
- Server State: Consider TanStack Query or similar for caching
API Integration
- HttpClient: Always use with interceptors for auth/error handling
- Error Handling: Use catchError operator, show user-friendly messages
- Loading States: Track loading state for better UX
Forms
- Reactive Forms: Prefer over template-driven for complex forms
- Validation: Custom validators in separate files
- Error Display: Consistent error message components
Testing
- Unit Tests: Use TestBed, mock dependencies
- Component Tests: Use ComponentFixture
- E2E: Cypress or Playwright
Available Modules
| Module | File | Use When | |--------|------|----------| | Component Patterns | components.md | Creating/modifying components | | State Management | state-management.md | Adding state, signals, stores | | API Integration | api-integration.md | HTTP calls, services, interceptors | | Forms & Validation | forms-validation.md | Forms, validators, error display | | Dos and Don'ts | dos-and-donts.md | Project-specific learnings |
How to Load Modules
When you need detailed patterns, read the specific module:
Read: .claude/skills/frontend-angular/[module].md
Project Context
Tech Stack
<!-- Extracted from specwright/product/tech-stack.md -->- Framework: Angular [ANGULAR_VERSION]
- State Management: [STATE_MANAGEMENT_LIBRARY]
- UI Library: [UI_LIBRARY]
- Testing: [TESTING_FRAMEWORK]
- Build Tool: [BUILD_TOOL]
Architecture Patterns
<!-- Extracted from specwright/product/architecture-decision.md -->[ARCHITECTURE_PATTERNS]
Project Structure
<!-- Extracted from specwright/product/architecture-structure.md -->[PROJECT_STRUCTURE]
Design System
<!-- Extracted from specwright/product/design-system.md -->Colors
[DESIGN_COLORS]
Typography
[DESIGN_TYPOGRAPHY]
Spacing
[DESIGN_SPACING]
Components
[DESIGN_COMPONENTS]
Reference: specwright/product/design-system.md
UX Patterns
<!-- Extracted from specwright/product/ux-patterns.md -->Navigation
[UX_NAVIGATION]
User Flows
[UX_USER_FLOWS]
Feedback States
[UX_FEEDBACK_STATES]
Accessibility
[UX_ACCESSIBILITY]
Reference: specwright/product/ux-patterns.md
Self-Learning
Wenn du während der Implementierung etwas lernst:
- Unerwartetes Verhalten
- Besserer Ansatz gefunden
- Fehler der Zeit gekostet hat
→ Füge es zu dos-and-donts.md in diesem Ordner hinzu.
Related Skills
michsindlinger/session-handoff
tools
VerifiedTrustedCommunity
Session Handoff: Erstellt eine vollständige Zusammenfassung der aktuellen Session für einen sauberen Kontextwechsel. NUR bei explizitem Aufruf (/session-handoff). NICHT automatisch auslösen. Geeignet wenn der User die Session resetten will, den Kontext aufräumen will, oder bei ~120k Tokens angelangt ist.
1SKILL.mdUpdated Jun 5, 2026
michsindlinger/pre-mortem
development
VerifiedTrustedCommunity
Pre-Mortem Risk Analysis: Strukturierte Prospective-Hindsight-Übung um launch-blocking Risiken vor Commitment aufzudecken. Team stellt sich vor, das Produkt sei 14 Tage nach Launch gefloppt, und arbeitet rückwärts. Klassifiziert Risiken in Tigers (echt), Paper Tigers (hypothetisch), Elephants (unausgesprochen). Nutze diesen Skill vor Build-Commitment, bei zu hoher Stakeholder-Confidence, vor Major-Releases, oder wenn das Team vage Sorgen nicht artikulieren kann. Trigger: /pre-mortem, 'pre-mortem', 'risk analysis', 'was könnte schiefgehen', 'risiken vor launch'.
1SKILL.mdUpdated Jun 5, 2026
michsindlinger/specwright/templates/skills/atomicity-validator
testing
VerifiedTrustedCommunity
Six-Sigma Atomicity Validator for create-spec stories
1SKILL.mdUpdated May 21, 2026
michsindlinger/specwright/templates/skills/ux-patterns-definition
tools
VerifiedTrustedCommunity
UX pattern definition guidance for navigation, user flows, interactions, and accessibility
1SKILL.mdUpdated Apr 17, 2026