frontend-fundamentals
フロントエンドコンポーネントの基礎をレビューする
フロントエンドレビューでは、コンポーネントが保守しにくくなるまで、アーキテクチャ、状態、アクセシビリティ、パフォーマンスの問題が見落とされがちです。このスキルは、Claude、Codex、Claude Codeがコンポーネント品質のための焦点を絞ったチェックリスト質問とレビューパターンに沿って進められるようにします。
自分のエージェントでインストール
このリクエストをエージェントにコピーしてください。正規の Skill ページとマニフェストが含まれています。
Review the Skillstore skill "frontend-fundamentals" from https://skillstore.io/skills/danielpodolsky-frontend-fundamentals.md and its manifest at https://skillstore.io/api/skills/danielpodolsky-frontend-fundamentals/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.エージェントは引き続き計画を提示し、セキュリティポリシーで必要な確認を求める必要があります。
エージェントが読めるリソース
AI エージェント、クローラー、スクリプトがページ全体ではなく整理されたコンテキストを必要とする場合は、これらのリンクを使ってください。
テストする
「frontend-fundamentals」を使用しています。 ダッシュボードコンポーネントが、データ読み込み、ルーティング判断、状態更新、すべての表示を処理している。
期待される結果:
レビューでは、containerの責務をより小さなpresentation componentから分離し、データ読み込みロジックを抽出することを推奨します。
「frontend-fundamentals」を使用しています。 あるコンポーネントが、同じuser objectを4階層ネストした先の1つのwidgetまで渡している。
期待される結果:
レビューではprop drillingを指摘し、より近いデータソースやshared contextを使うことで依存関係が明確になるかを問いかけます。
「frontend-fundamentals」を使用しています。 list viewが毎回のrender中にitemsをフィルタリングし、interactive controlsに汎用コンテナを使っている。
期待される結果:
レビューでは、コストの高いderived valuesをmemoizeし、nonsemanticなinteractive elementsをアクセシブルなcontrolsに置き換えることを提案します。
セキュリティ監査
安全All eight static findings are false positives caused by Markdown fenced examples in SKILL.md, not Ruby or shell backtick execution. The skill is prose guidance for frontend code review, and no semantic evidence of prompt injection, data exfiltration, or unsafe operational intent was found.
リスク要因
このレポートを共有・引用
バージョン付き評価レポート、中立的なバッジ、埋め込みカード、引用を共有できます。Skillstore は証拠を報告しますが、この Skill が安全かどうかは判断しません。
レポートリンクをコピー
https://skillstore.io/skills/danielpodolsky-frontend-fundamentals/audits/8?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_reportMarkdownバッジ
[](https://skillstore.io/skills/danielpodolsky-frontend-fundamentals?utm_source=security_passport_badge)HTMLバッジ
<a href="https://skillstore.io/skills/danielpodolsky-frontend-fundamentals?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/danielpodolsky-frontend-fundamentals/security.svg" alt="Skillstore security assessment" loading="lazy"></a>埋め込みカード
<iframe src="https://skillstore.io/embed/skills/danielpodolsky-frontend-fundamentals.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形式の引用
DanielPodolsky. (2026). frontend-fundamentals security audit report (audit version 8) [Author version unspecified]. Skillstore. https://skillstore.io/skills/danielpodolsky-frontend-fundamentals/audits/8BibTeX形式の引用
@techreport{danielpodolsky-danielpodolsky-frontend-fundamentals-2026,
author = {DanielPodolsky},
title = {frontend-fundamentals security audit report (audit version 8)},
institution = {Skillstore},
year = {2026},
number = {8},
url = {https://skillstore.io/skills/danielpodolsky-frontend-fundamentals/audits/8},
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: "frontend-fundamentals security audit report (audit version 8)"
version: "unspecified"
type: report
authors:
- name: "DanielPodolsky"
date-released: "2026-07-06"
url: "https://skillstore.io/skills/danielpodolsky-frontend-fundamentals/audits/8"
identifiers:
- type: other
value: "skillstore:danielpodolsky-frontend-fundamentals:audit:8"
description: "Skillstore immutable audit report identifier"
Skillstore スコア
このスコアの理由 証拠の信頼度: 高作成できるもの
pull requestをレビューする
フロントエンドコンポーネントの変更をマージする前に、構造化されたチェックリストを適用します。
コンポーネント設計を指導する
ガイド付きの質問を使って、開発者が分割、状態、命名の問題を特定できるよう支援します。
UIの保守性を監査する
複雑性とレビューコストを増やす反復パターンがないか、コンポーネント群を評価します。
これらのプロンプトを試す
frontend-fundamentals checklistを使って、このフロントエンドコンポーネントをレビューしてください。単一責務、prop数、アクセシビリティに焦点を当ててください。
状態管理の観点から、これらの関連コンポーネントをレビューしてください。どの状態をローカルに保つべきか、上位に移動すべきか、server state toolsを使うべきかを特定してください。
このUI変更について、回避可能な再レンダリング、重いレンダリング処理、lazy loadingの機会、semantic HTML、キーボードアクセスを監査してください。
メンターとして、このpull requestをレビューしてください。まずソクラテス式の質問を行い、その後、最も影響の大きいフロントエンドアーキテクチャの変更点を列挙してください。
ベストプラクティス
- レビューで責務の境界を判断できるよう、完全なコンポーネントと近接する呼び出し元を提供します。
- 大きなpull requestをレビューする際は、最も影響の大きい指摘を先に求めます。
- コード変更を依頼する前に、チェックリストの結果をプロジェクトの規約と照らし合わせます。
回避
- プロダクトのコンテキストを考慮せず、チェックリストを硬直したルールとして使うこと。
- コンポーネントコードやユーザーフローを共有せずに広範なレビューを依頼すること。
- 実際の影響を測定する前に、パフォーマンス提案を必須事項として扱うこと。
よくある質問
このスキルはどのフレームワークに対応していますか？
コードを自動的に変更しますか？
アクセシビリティテストの代わりになりますか？
ジュニア開発者のメンタリングに役立ちますか？
外部ツールは含まれていますか？
どのようなコード品質の問題を重視しますか？
開発者情報
作成者
DanielPodolskyライセンス
MIT
Skillstore リビジョン
r1
バージョンに関する注意
作者はバージョンを宣言していません。
参照
34f316ba14ef36c7a620fc09f2676d2429997a77
メンテナンスの新しさ
2026/7/18
利用状況
14 ダウンロード · 181 閲覧
ファイル構成
📄 SKILL.md