angular-expert

Angular 17+ gotchas and decision criteria. Covers signals vs observables, standalone patterns, and common pitfalls Claude gets wrong.

Best use case

angular-expert is best used when you need a repeatable AI agent workflow instead of a one-off prompt.

Angular 17+ gotchas and decision criteria. Covers signals vs observables, standalone patterns, and common pitfalls Claude gets wrong.

Teams using angular-expert should expect a more consistent output, faster repeated execution, less prompt rewriting.

When to use this skill

  • You want a reusable workflow that can be run more than once with consistent structure.

When not to use this skill

  • You only need a quick one-off answer and do not need a reusable workflow.
  • You cannot install or maintain the underlying files, dependencies, or repository context.

Installation

Claude Code / Cursor / Codex

$curl -o ~/.claude/skills/angular-expert/SKILL.md --create-dirs "https://raw.githubusercontent.com/nguyenthienthanh/aura-frog/main/aura-frog/skills/angular-expert/SKILL.md"

Manual Installation

  1. Download SKILL.md from GitHub
  2. Place it in .claude/skills/angular-expert/SKILL.md inside your project
  3. Restart your AI agent — it will auto-discover the skill

How angular-expert Compares

Feature / Agentangular-expertStandard Approach
Platform SupportNot specifiedLimited / Varies
Context Awareness High Baseline
Installation ComplexityUnknownN/A

Frequently Asked Questions

What does this skill do?

Angular 17+ gotchas and decision criteria. Covers signals vs observables, standalone patterns, and common pitfalls Claude gets wrong.

Where can I find the source code?

You can find the source code on GitHub using the link provided at the top of the page.

SKILL.md Source

> **AI-consumed reference.** Optimized for Claude to read during execution.
> Human-readable explanation: see [docs/architecture/HIERARCHICAL_PLANNING.md](../../../docs/architecture/HIERARCHICAL_PLANNING.md)
> or [docs/getting-started/](../../../docs/getting-started/) depending on topic.


# Angular Expert — Gotchas & Decisions

Use Context7 for full Angular docs.

## Key Decisions

```toon
decisions[4]{choice,use_when}:
  Signals vs Observables,"Signals for sync UI state. Observables for async streams/HTTP. Bridge with toSignal()/toObservable()"
  NgRx vs Signals,"NgRx for complex shared state with effects. Signals for component/simple app state"
  Standalone vs Module,"Always standalone (Angular 17+). Modules only for legacy"
  OnPush vs Default,"Always OnPush. Requires immutable patterns"
```

## Gotchas

- `@for` requires `track` — use `track item.id` not `trackBy` function
- `takeUntilDestroyed(this.destroyRef)` must be called in injection context (constructor or field init)
- `toSignal()` returns `Signal<T | undefined>` — handle the undefined
- `NonNullableFormBuilder` for typed forms — plain `FormBuilder` loses types
- `@defer (on viewport)` needs `@placeholder` block or nothing renders
- Functional guards/interceptors: use `inject()` not constructor DI

Related Skills

vue-expert

14
from nguyenthienthanh/aura-frog

Vue 3 gotchas and decision criteria. Covers reactivity traps, Composition API pitfalls, and Pinia patterns.

typescript-expert

14
from nguyenthienthanh/aura-frog

TypeScript gotchas and decision criteria covering nullish coalescing pitfalls (|| vs ??), strict tsconfig settings (noUncheckedIndexedAccess, exactOptionalPropertyTypes), type guard patterns, discriminated unions, and as const vs enum. Use when writing TypeScript, configuring tsconfig, implementing type guards, or debugging null/undefined errors.

refactor-expert

14
from nguyenthienthanh/aura-frog

Guide safe, incremental refactoring that improves code quality without changing behavior.

react-native-expert

14
from nguyenthienthanh/aura-frog

React Native gotchas and decision criteria. Covers FlatList optimization, storage hierarchy, and platform-specific pitfalls.

react-expert

14
from nguyenthienthanh/aura-frog

React gotchas and decision criteria covering stale closure bugs in useEffect, conditional rendering traps (falsy 0/empty string), state management selection (useState vs Context vs Zustand vs TanStack Query), and hooks rules. Use when writing React components, debugging re-renders, choosing state management, or encountering useEffect infinite loops.

python-expert

14
from nguyenthienthanh/aura-frog

Python gotchas and decision criteria. Covers async pitfalls, FastAPI/Django patterns, and type hint traps.

nodejs-expert

14
from nguyenthienthanh/aura-frog

Node.js gotchas and decision criteria. Covers async pitfalls, Express/NestJS patterns, and common mistakes.

nextjs-expert

14
from nguyenthienthanh/aura-frog

Next.js 14+ gotchas and decision criteria. Covers server/client boundary, caching strategy, and data fetching patterns Claude commonly gets wrong.

laravel-expert

14
from nguyenthienthanh/aura-frog

Laravel/PHP gotchas and decision criteria. Covers N+1 prevention, Eloquent traps, and migration safety.

go-expert

14
from nguyenthienthanh/aura-frog

Go gotchas and decision criteria. Covers error handling patterns, concurrency pitfalls, and interface design.

design-expert

14
from nguyenthienthanh/aura-frog

UI/UX design expertise — component design, design system selection, responsive layout. Includes auto-detection from package.json and Context7 integration for library docs.

tree-of-thoughts

14
from nguyenthienthanh/aura-frog

Branch, evaluate, prune, expand — structured search over solution space. Use for architecture with multi-step decisions, refactor planning, or complex debug hypothesis trees. Paper: Yao et al. 2023.