Создавайте standalone-компоненты Angular 20
Командам Angular нужны единообразные standalone-компоненты, которые следуют актуальным паттернам фреймворка. Этот навык помогает Claude, Codex и Claude Code генерировать компоненты с signals, современными шаблонами и чистой интеграцией сервисов.
Скопируйте этот запрос в своего Агента. Он содержит каноническую страницу Skill и манифест.
Review the Skillstore skill "angular-20-standalone-component" from https://skillstore.io/skills/7spade-angular-20-standalone-component.md and its manifest at https://skillstore.io/api/skills/7spade-angular-20-standalone-component/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.Ваш Агент по-прежнему должен показать план и запросить все подтверждения, требуемые политикой безопасности.
Используйте эти ссылки, когда AI-агенту, crawler или script нужен чистый контекст вместо полной страницы.
Использование «angular-20-standalone-component». Запросить standalone-компонент списка задач с загрузкой через сервис и событиями обновления.
Ожидаемый результат:
План компонента с состоянием на signals, внедрением сервиса, обработкой загрузки, обработкой пустого состояния и типизированными output-событиями.
Использование «angular-20-standalone-component». Попросить модернизировать старый компонент, который использует декораторы и структурные директивы.
Ожидаемый результат:
План рефакторинга, который заменяет устаревшие декораторы и директивы функциями и control flow Angular 20.
Использование «angular-20-standalone-component». Запросить компонент формы для создания задач.
Ожидаемый результат:
Дизайн компонента формы с reactive validation, событиями submit, поведением reset и обновлениями состояния, удобными для OnPush.
All static findings were adjudicated as false positives caused by Markdown backticks, TypeScript template strings, and normal Angular sample identifiers. No prompt injection, command execution intent, data exfiltration, or system reconnaissance behavior was found in SKILL.md.
Делитесь версионным отчетом об оценке, нейтральным значком, встраиваемой карточкой и цитатами. Skillstore публикует доказательства, не решая, безопасен ли этот Skill.
https://skillstore.io/skills/7spade-angular-20-standalone-component/audits/6?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_report[](https://skillstore.io/skills/7spade-angular-20-standalone-component?utm_source=security_passport_badge)<a href="https://skillstore.io/skills/7spade-angular-20-standalone-component?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/7spade-angular-20-standalone-component/security.svg" alt="Skillstore security assessment" loading="lazy"></a><iframe src="https://skillstore.io/embed/skills/7spade-angular-20-standalone-component.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>7Spade. (2026). angular-20-standalone-component security audit report (audit version 6) [Author version unspecified]. Skillstore. https://skillstore.io/skills/7spade-angular-20-standalone-component/audits/6@techreport{7spade-7spade-angular-20-standalone-component-2026,
author = {7Spade},
title = {angular-20-standalone-component security audit report (audit version 6)},
institution = {Skillstore},
year = {2026},
number = {6},
url = {https://skillstore.io/skills/7spade-angular-20-standalone-component/audits/6},
note = {Author version unspecified}
}cff-version: 1.2.0
message: "If you use this Skill, cite its author and this versioned security audit report."
title: "angular-20-standalone-component security audit report (audit version 6)"
version: "unspecified"
type: report
authors:
- name: "7Spade"
date-released: "2026-07-06"
url: "https://skillstore.io/skills/7spade-angular-20-standalone-component/audits/6"
identifiers:
- type: other
value: "skillstore:7spade-angular-20-standalone-component:audit:6"
description: "Skillstore immutable audit report identifier"
Сгенерировать standalone-компонент с signals, состояниями загрузки, состояниями ошибок и интеграцией сервиса.
Переписать руководство по компонентам, отказавшись от декораторов, NgModules и устаревших директив шаблонов.
Дать AI-ассистентам повторяемый шаблон для новых компонентов во всем Angular workspace.
Создайте standalone-компонент Angular 20 для карточки задачи. Используйте signals, input(), output(), @if, @for, inject() и OnPush.
Создайте standalone-компонент списка задач, который загружает данные из сервиса, показывает состояния загрузки и ошибок и отправляет обновления задач.
Отрефакторьте этот план Angular-компонента, чтобы использовать standalone imports, signals, inject(), input(), output() и новый template control flow.
Спроектируйте standalone-компонент формы Angular 20 с reactive validation, типизированными outputs, обнаружением изменений OnPush и понятными пустыми состояниями и состояниями ошибок.
Автор
7SpadeЛицензия
MIT
Ревизия Skillstore
r1
Примечание о версии
Автор не указал версию.
Ссылка
c1fdca50ff516318f65fed0d7f9e82797c5171dc
Актуальность поддержки
20.07.2026
Использование
11 загрузок · 213 просмотров
Структура файлов
📄 SKILL.md
Создавайте надежные AI Skills
Командам, работающим с ИИ, часто нужны повторно используемые рабочие процессы, но им не хватает четкой структуры навыков. Этот навык помогает Claude, Codex и Claude Code планировать, создавать, проверять и упаковывать навыки.
Выбор ролей Azure с минимальными привилегиями
Решения о ролях Azure могут предоставлять слишком широкий доступ, когда требования неясны. Этот навык сопоставляет нужные разрешения с минимальными ролями и рекомендациями по назначению.
Тестирование веб-приложений с Playwright
Изменения во фронтенде требуют проверки в реальном браузере, а не только статических проверок. Этот навык помогает Claude, Codex и Claude Code выполнять тестирование на основе Playwright, отладку, создание скриншотов и проверку консоли.
Создание утилит Angular с @delon/util
Команды Angular часто повторно реализуют логику форматирования данных, клонирования, группировки и браузерных хелперов. Этот навык показывает, как использовать хелперы @delon/util в компонентах ng-alain и рабочих процессов задач.
Подготовка документации, проверенной читателями
Важные документы часто оказываются неэффективными, потому что ключевой контекст остается в голове автора. Этот навык проводит Claude, Codex или Claude Code через сбор контекста, структурированную подготовку черновика, итеративное уточнение и тестирование на читателях.
Создавайте дашборды с диаграммами @delon
Командам Angular нужны согласованные диаграммы, соответствующие шаблонам дашбордов ng-alain. Этот skill предоставляет примеры @delon/chart и рекомендации для распространенных корпоративных визуализаций.
Улучшение компонентов Vue Options API
от vuejs-ai
Проекты на Vue Options API могут терять безопасность типов и корректную привязку this. Этот skill дает прямые шаблоны для более безопасных компонентов Vue.
Создание готовых к промышленной эксплуатации фронтенд-функций
от davila7
Фронтенд-командам нужны согласованные рекомендации по React и Next.js для разных проектов. Этот навык предоставляет справочные рабочие процессы, практики обеспечения качества и вспомогательные скрипты для анализа фронтенда.
Улучшение покрытия тестами Playwright
от C0ntr0lledCha0s
Наборы тестов Playwright могут становиться нестабильными, когда конфигурация, локаторы и фикстуры непоследовательны. Этот навык дает практические шаблоны для надежных браузерных тестов, отладки и переиспользуемых page objects.
Создание приложений Starknet с помощью starknet.js
от internet-court
Интеграции со Starknet требуют точной работы с провайдерами, аккаунтами, транзакциями и комиссиями. Этот навык предоставляет Claude, Codex и Claude Code практические паттерны starknet.js v9.
Улучшение качества кода Vue 3
от vuejs-ai
В проектах Vue со временем часто накапливаются ошибки, связанные с реактивностью, компонентами и производительностью. Этот навык дает целевые рекомендации по Vue 3 для более безопасных паттернов и более понятного кода.
Реализация React View Transitions
от vercel-labs
Переходы представлений React легко разместить неправильно, что приводит к незаметным или избыточным анимациям. Этот навык помогает выбирать анимации для маршрутов, Suspense, списков и общих элементов.