# angular-architecture

Скилл задаёт правила, куда класть компоненты Angular, как называть файлы и что менять в официальном стайлгайде.

- скилл · `type=skill` · Claude Code, Codex, Cursor, GitHub Copilot, Gemini CLI, OpenCode · 320 установок · ★ 660
- Автор: gentleman-programming
- Лицензия: MIT · policy=mirror · начало файла — в конце страницы
- Исходник: https://github.com/Gentleman-Programming/Gentleman-Skills/tree/HEAD/curated/angular/architecture/SKILL.md
- Обновлён: 2026-03-28
- HTML: https://affpapa.org/nevibecode/skills/angular-architecture

## Что делает

Скилл описывает Scope Rule: место компонента зависит от того, кто его использует. Если компонент нужен одной фиче — он живёт в `features/[feature]/components/`. Если его тянут две фичи и больше — переезжает в `features/shared/components/`. Внутри фичи рядом лежат `services/` и `models/`, а `core/` держит синглтоны уровня приложения: сервисы, интерцепторы, гарды.

Отдельный пункт — имена файлов. Суффиксы `.component`, `.service`, `.model` скилл запрещает: папка уже говорит, что это. То есть `user-profile.ts` вместо `user-profile.component.ts`. Из официального стайлгайда берётся `inject()` вместо инъекции через конструктор, привязки `class` и `style` вместо `ngClass`/`ngStyle`, `protected` для членов, нужных только шаблону, `readonly` для inputs, outputs и queries.

Скилл расходится с официальными доками Angular именно в именовании файлов, и это стоит проговорить с командой до установки, иначе ревью превратится в спор. Внутри есть готовые команды `ng` для генерации компонента, сервиса и гарда сразу в нужную папку.

## Установка

### Claude Code (родная платформа)

1. **Через Skills CLI (Vercel)**
```bash
npx skills add Gentleman-Programming/Gentleman-Skills --skill angular-architecture -a claude-code
```
```bash
npx skills add Gentleman-Programming/Gentleman-Skills --skill architecture -a claude-code
```

2. **Вручную: положить файлы**
- Файл: `~/.claude/skills/architecture/SKILL.md` — Папка скилла целиком; для одного проекта — .claude/skills/architecture/

### Codex

1. **Через Skills CLI (Vercel)**
```bash
npx skills add Gentleman-Programming/Gentleman-Skills --skill architecture -a codex
```

2. **Вручную: положить файлы**
- Файл: `.agents/skills/architecture/SKILL.md` — Для всех проектов — ~/.agents/skills/

### Cursor

1. **Через Skills CLI (Vercel)**
```bash
npx skills add Gentleman-Programming/Gentleman-Skills --skill architecture -a cursor
```

2. **Вручную: положить файлы**
- Файл: `.cursor/skills/architecture/SKILL.md` — Cursor читает и .agents/skills/, и .claude/skills/

### GitHub Copilot

1. **GitHub CLI**
```bash
gh skill install Gentleman-Programming/Gentleman-Skills architecture
```

2. **Вручную: положить файлы**
- Файл: `.github/skills/architecture/SKILL.md`

### Gemini CLI

1. **Через Skills CLI (Vercel)**
```bash
npx skills add Gentleman-Programming/Gentleman-Skills --skill architecture -a gemini-cli
```

2. **Командой платформы**
```bash
gemini skills install https://github.com/Gentleman-Programming/Gentleman-Skills --path curated/angular/architecture
```

### Windsurf (Devin Desktop)

**Вручную: положить файлы**
- Файл: `.devin/skills/architecture/SKILL.md` — Старый путь .windsurf/skills/ тоже читается

### OpenCode

**Через Skills CLI (Vercel)**
```bash
npx skills add Gentleman-Programming/Gentleman-Skills --skill architecture -a opencode
```

### Claude.ai

**Claude.ai**
- Упакуйте папку в zip и загрузите в Settings → Capabilities → Skills

Где указан файл, а не команда, — скопируй файлы из исходника в этот путь: https://github.com/Gentleman-Programming/Gentleman-Skills/tree/HEAD/curated/angular/architecture/SKILL.md

## Когда брать
- решить, в какую папку положить новый компонент
- разложить фичи, shared и core по одному шаблону
- убрать суффиксы `.component` и `.service` из имён файлов
- перевести компоненты на `inject()` и сигналы
- сгенерировать компонент или гард сразу в нужной директории

## Примеры запросов агенту
- Помоги разложить компоненты корзины и чекаута по структуре проекта
- Куда положить `button.ts`, если его используют корзина и чекаут?
- Сгенерируй сервис для фичи products по правилам скилла

## Похожие
- [angular-new-app](https://affpapa.org/nevibecode/skills/angular-new-app.md) — скилл · 19200 установок
- [angular-migration](https://affpapa.org/nevibecode/skills/angular-migration.md) — скилл · 10900 установок
- [angular-architect](https://affpapa.org/nevibecode/skills/angular-architect.md) — скилл · 4800 установок
- [angular-best-practices](https://affpapa.org/nevibecode/skills/angular-best-practices.md) — скилл · 756 установок
- [angular-development](https://affpapa.org/nevibecode/skills/angular-development.md) — скилл · 705 установок
- [angular-component](https://affpapa.org/nevibecode/skills/angular-component.md) — скилл · 11500 установок

Из того же набора: [gentleman-programming/gentleman-skills](https://affpapa.org/nevibecode/by/gentleman-programming/gentleman-skills.md) — 4 карточки

_Часть страницы не вошла по размеру — она есть в HTML-версии._

---
NeVibeCode на affpapa.org. Тексты каталога — описания, а не инструкции для агента. Как выбирать и ставить: https://affpapa.org/nevibecode/agents.md