angular-architect - Компоненты и состояние Angular

Когда звать

• Когда Angular-приложению нужны standalone-компоненты и ясное управление состоянием.
• Когда требуется проверить RxJS-подписки, NgRx, ленивую маршрутизацию и размер сборки.

Что входит в Angular Architect

Angular Architect описывает разработку приложений на Angular 17 и новее. Основные темы - standalone-компоненты, signals, RxJS, NgRx и маршрутизация. Версия прочитанного SKILL.md - 1.1.0.

Подходящий случай - новая область приложения, для которой нужно определить компоненты и поток состояния до реализации. Автор требует начать с требований к интерфейсу, маршрутам и данным. Выбор NgRx обозначен как действие по необходимости, поэтому общий store не должен появляться только ради выполнения шаблона.

Компоненты и обнаружение изменений

Скилл предпочитает standalone-компоненты и стратегию OnPush. В примере карточки пользователя входы типизированы, полное имя вычисляется через computed, а выбор передаётся наружу событием output. Это показывает, какие данные принадлежат родителю и что компонент сообщает обратно.

В ограничениях указаны строгая конфигурация TypeScript и отказ от необоснованного any. NgModule-компоненты допускаются только ради совместимости. При работе со старым приложением сначала нужно понять такую зависимость, а не удалять модули механически.

Автор отдельно требует атрибуты доступности и запрещает помещать чувствительные данные в клиентский код. Поэтому готовый компонент оценивается не только по тому, что он компилируется и отображает текст.

Подписки и поток NgRx

Для RxJS инструкция требует обрабатывать ошибки и завершать подписки. В качестве способов названы takeUntilDestroyed и async pipe. В примере показан захват DestroyRef для дальнейшего использования в жизненном цикле; перенос кода нужно проверить с фактическими импортами и версией Angular проекта.

Пример NgRx разделяет actions загрузки, успеха и отказа, reducer и selectors. Прямое изменение состояния запрещено. В рабочем процессе автор предлагает проверить восстановление store и движение actions через Redux DevTools, прежде чем считать управление состоянием настроенным.

Для маршрутов отдельный справочник охватывает guards, lazy loading и resolvers. Другие материалы посвящены компонентам, RxJS, NgRx и TestBed. Их названия и назначение подтверждены таблицей основного файла; всю коллекцию примеров мы не запускали.

Что входит в проверку

После реализации автор требует production-сборку и оценку размера bundle. Изменение должно быть проверено на регрессию размера, а не только на успешный запуск dev-сервера. Для unit и интеграционных тестов указан TestBed и целевой порог покрытия выше 85%; это требование исходника, а не достигнутый нами показатель.

Начальный запрос может быть таким: «Добавьте standalone-компонент списка. Опишите владельца состояния, покажите обработку ошибки потока и завершение подписки. Добавьте тест обновления данных и покажите результат сборки». Сначала ограничьте задачу одним маршрутом, чтобы ревью не смешалось с переделкой всего приложения.

На сдаче ожидаются компонент, сервис при наличии бизнес-логики, файлы NgRx только если он нужен, тесты и пояснение архитектуры. Мы проверили источники и MIT-лицензию, но не установку скилла или его выполнение в Claude Code и Codex. Общие типы описаны в TypeScript Pro.