スキル ng-alain-component-development

📦

ng-alain-component-development

Name: ng-alain-component-development
Author: 7Spade

コンテンツリビジョン r1 安全 ⚙️ 外部コマンド🌐 ネットワークアクセス

ng-alain Angular コンポーネントを構築する

エンタープライズ Angular チームには、一貫性のある ng-alain コンポーネントが必要です。このスキルは、テーブル、フォーム、ACL、レイアウト、テーマ設定、アクセシビリティのパターンを案内します。

対応: Claude Codex Code(CC)

🥉 77 ブロンズ

自分のエージェントでインストール

このリクエストをエージェントにコピーしてください。正規の Skill ページとマニフェストが含まれています。

エージェントリクエスト

Review the Skillstore skill "ng-alain-component-development" from https://skillstore.io/skills/7spade-ng-alain-component-development.md and its manifest at https://skillstore.io/api/skills/7spade-ng-alain-component-development/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.

エージェントは引き続き計画を提示し、セキュリティポリシーで必要な確認を求める必要があります。

エージェントが読めるリソース

AI エージェント、クローラー、スクリプトがページ全体ではなく整理されたコンテキストを必要とする場合は、これらのリンクを使ってください。

Markdown詳細 GET /skills/7spade-ng-alain-component-development.md 署名済み manifest GET /api/skills/7spade-ng-alain-component-development/manifest 署名済み lockfile GET /api/skills/7spade-ng-alain-component-development/lockfile

テストする

「ng-alain-component-development」を使用しています。ステータスバッジと編集・削除アクションを備えたタスクテーブルを作成してください。

期待される結果:

ng-alain ST テーブル規約を使用した standalone Angular コンポーネント。
識別子、タイトル、ステータスバッジ、日付、行アクションに関するカラムのガイダンス。
読み込み状態、ページネーション、削除確認、ハンドラー配置に関するメモ。

「ng-alain-component-development」を使用しています。担当者と期限フィールドを備えたタスク作成用の schema form を作成してください。

期待される結果:

タイトル、説明、ステータス、優先度、担当者、期限、タグを含む SF フォーム構造。
必須フィールドとフィールド長制限に関するバリデーションガイダンス。
レスポンシブグリッドのガイダンスと、送信および変更イベントのイベント処理メモ。

「ng-alain-component-development」を使用しています。レスポンシブレイアウトとアクセシビリティの観点で、私の ng-alain ダッシュボードをレビューしてください。

期待される結果:

グリッドブレークポイント、コンポーネントラベル、読み込み状態、キーボードアクセスを対象とするレビューチェックリスト。
テーマ変数の使用とダークモードの挙動に関する推奨事項。
モバイルテストとユーザーフィードバック状態に関する具体的なフォローアップ項目。

セキュリティ監査

安全

v6 • 2026/7/6 バージョン別レポートを開く

All static findings were adjudicated as false positives from Markdown code fences, Angular TypeScript examples, CSS tokens, or documentation links. No prompt injection, data exfiltration intent, executable shell behavior, or unauthorized network behavior was found in SKILL.md.

スキャンされたファイル

641

解析済み行数

レビュー項目

誤検知を無視

最新の完了済み静的・セマンティック監査では、確認済みのセキュリティ検出事項は見つかりませんでした。これは、スキルに副作用がないことを証明するものではありません。

監査者: codex 監査履歴を表示 →

このレポートを共有・引用

バージョン付き評価レポート、中立的なバッジ、埋め込みカード、引用を共有できます。Skillstore は証拠を報告しますが、この Skill が安全かどうかは判断しません。

バージョン別レポートを開く

レポートリンクをコピー

https://skillstore.io/skills/7spade-ng-alain-component-development/audits/6?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_report

Markdownバッジ

[![Skillstore security assessment](https://skillstore.io/badges/skills/7spade-ng-alain-component-development/security.svg)](https://skillstore.io/skills/7spade-ng-alain-component-development?utm_source=security_passport_badge)

HTMLバッジ

<a href="https://skillstore.io/skills/7spade-ng-alain-component-development?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/7spade-ng-alain-component-development/security.svg" alt="Skillstore security assessment" loading="lazy"></a>

埋め込みカード

<iframe src="https://skillstore.io/embed/skills/7spade-ng-alain-component-development.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>

学術引用 (APA · BibTeX · CFF)

APA形式の引用

7Spade. (2026). ng-alain-component-development security audit report (audit version 6) [Author version unspecified]. Skillstore. https://skillstore.io/skills/7spade-ng-alain-component-development/audits/6

BibTeX形式の引用

@techreport{7spade-7spade-ng-alain-component-development-2026,
  author = {7Spade},
  title = {ng-alain-component-development security audit report (audit version 6)},
  institution = {Skillstore},
  year = {2026},
  number = {6},
  url = {https://skillstore.io/skills/7spade-ng-alain-component-development/audits/6},
  note = {Author version unspecified}
}

CITATION.cff

cff-version: 1.2.0
message: "If you use this Skill, cite its author and this versioned security audit report."
title: "ng-alain-component-development security audit report (audit version 6)"
version: "unspecified"
type: report
authors:
  - name: "7Spade"
date-released: "2026-07-06"
url: "https://skillstore.io/skills/7spade-ng-alain-component-development/audits/6"
identifiers:
  - type: other
    value: "skillstore:7spade-ng-alain-component-development:audit:6"
    description: "Skillstore immutable audit report identifier"

Skillstore スコア

このスコアの理由証拠の信頼度: 高

アーキテクチャ

保守性

コンテンツ

コミュニティ

仕様準拠

作成できるもの

エンタープライズ向けテーブルを作成する

ST カラム、バッジ、アクション、ページネーション、読み込み状態を備えたタスク、ユーザー、監査テーブルを構築します。

Angular UI パターンを標準化する

共有 imports、@delon コンポーネント、ACL チェック、テーマ設定、レスポンシブレイアウトをプロダクト画面全体で統一します。

コンポーネント品質をレビューする

生成された ng-alain コンポーネントについて、アクセシビリティラベル、モバイルレイアウトの挙動、ユーザーフィードバック状態を確認します。

これらのプロンプトを試す

Simple Table を作成する

[entity] の standalone ng-alain テーブルコンポーネントを作成してください。ST カラム、読み込み状態、ページネーション、編集と削除のアクションを使用してください。

Schema Form を作成する

[entity] の SF schema form を作成してください。必須フィールド、非同期 select オプション、送信処理、変更処理、レスポンシブグリッド設定を含めてください。

管理ページを構築する

[workflow] の完全な ng-alain ページを作成してください。PageHeader、パンくず、ST テーブル、モーダルまたはドロワー内の SF フォーム、ACL で制御されたアクションを含めてください。

既存コンポーネントを監査する

この Angular コンポーネントを ng-alain のベストプラクティスの観点でレビューしてください。共有 imports、@delon の使用、レスポンシブレイアウト、ACL の網羅性、テーマ設定、読み込み状態、アクセシビリティを確認してください。

ベストプラクティス

共有 imports を使用して、standalone コンポーネント全体で ng-zorro と @delon の依存関係を一貫させます。
テーブル、フォーム、モーダル、ドロワーに、読み込み、空、エラー、確認の各状態を追加します。
アクセシブルなエンタープライズ画面のために、レスポンシブグリッド設定、テーマ変数、ARIA ラベルを使用します。

回避

保護されたアクションを CSS だけで非表示にして ACL チェックを回避しないでください。
モバイル対応が必要なページで、デスクトップ専用のグリッドサイズをハードコードしないでください。
テーブル、フォーム、モーダル、ドロワーのイベントハンドラーを、説明のないプレースホルダーのままにしないでください。

よくある質問

このスキルはどの Angular スタイルを使用しますか？

signals と共有 imports を使用した Angular 20 の standalone コンポーネントパターンに従います。

このスキルは ng-alain パッケージをインストールしますか？

いいえ。すでにライブラリが利用可能なプロジェクト向けに、実装ガイダンスと例を提供します。

コンポーネントコードの生成に役立ちますか？

はい。ng-alain と ng-zorro のパターンに従った Angular コンポーネントコードを AI アシスタントが下書きするためのガイダンスを提供します。

アクセス制御を扱っていますか？

はい。権限で制御されたアクションとコードレベルの権限チェックのための @delon/acl の例を含みます。

アクセシビリティのガイダンスは含まれていますか？

はい。ARIA ラベル、適切なフォームラベル、レスポンシブレイアウトチェック、モバイルテストのガイダンスを含みます。

バックエンド API の実装は含まれていますか？

いいえ。サービス呼び出しとデータソースは、プロジェクトのバックエンドに接続する必要があるプレースホルダーです。

開発者情報

作成者

7Spade

ライセンス

MIT

Skillstore リビジョン

バージョンに関する注意

作者はバージョンを宣言していません。

リポジトリ

https://github.com/7Spade/ng-dragon/tree/main/.github/skills/ng-alain-component

参照

c1fdca50ff516318f65fed0d7f9e82797c5171dc

メンテナンスの新しさ

2026/7/18

利用状況

14 ダウンロード · 188 閲覧

ファイル構成

堅牢な Angular UI 状態を構築する

作成者 sickn33

Angular のインターフェースでは、ローディング、エラー、フォーム、空データの扱いが一貫しないことがよくあります。このスキルは、Claude、Codex、Claude Code に、予測可能な UI 状態処理のための実践的なパターンを提供します。

コーディング＆開発表示

ng-alain-component-development

自分のエージェントでインストール

エージェントが読めるリソース

テストする

セキュリティ監査

リスク要因

レポートリンクをコピー

Markdownバッジ

HTMLバッジ

埋め込みカード

APA形式の引用

BibTeX形式の引用

CITATION.cff

Skillstore スコア

作成できるもの

エンタープライズ向けテーブルを作成する

Angular UI パターンを標準化する

コンポーネント品質をレビューする

これらのプロンプトを試す

ベストプラクティス

回避

よくある質問

開発者情報

7Spade のその他のスキル

skill-creator

azure-role-selector

webapp-testing

delon-util

doc-coauthoring

delon-chart

関連スキル

perigon-angular

angular-migration

perigon-agent

angular

angular-best-practices

angular-ui-patterns