JavaScript / React / Vue のフロントエンドコードを実装・レビュー・リファクタリングするときに、 現在のコードベースを調査し、適切な設計・パフォーマンス・レンダリングパターンを エージェントが自律的に選んで適用する。
ユーザーが hooks-pattern や dynamic-import などの 個別パターンを指定しなくても、必要な reference を選択する。
Trigger: front-end-design-patterns, frontend design patterns, React設計, Vue設計, JavaScript設計, Reactリファクタリング, Vueリファクタリング, フロントエンドパフォーマンス改善, bundle改善, レンダリング戦略, Reactレビュー, Vueレビュー
The English summary is being prepared. Showing the original description.
See how to installReview the instructions the agent will receive before you install.
JavaScript / React / Vue の設計・実装・レビュー・リファクタリングで、Patterns.dev 由来の参照知識を必要な分だけ読み、対象プロジェクトの既存コードに合わせて適用する。 このスキルはパターン名を増やすための教育スキルではなく、コードベース上の具体的な問題を Inspect / Classify / Select references / Apply or Review / Verify の流れで扱うための実務スキル。
package.json、build tool、routing、component 構成、data fetching、state 管理、既存の類似実装を確認してから判断する。references/decision-matrix.md で参照候補を絞り、必要な original reference だけを読む。大量の reference を一括で読み込まない。references/react/*.md、references/vue/*.md、または references/javascript/*.md の original-skill-body を読んでから判断する。依頼対象が明確な場合は対象ファイルと周辺利用箇所から読む。 対象が曖昧な場合は、プロジェクトの entrypoint、router、主要 component、package scripts、build tool を確認して作業範囲を絞る。
最低限確認する観点:
lint / test / typecheck / build などの検証コマンド次のいずれか、または複数に分類する。
分類できない場合は、まずコード上の症状を確認する。設計変更・性能改善・レビュー観点がない一般的な実装では、既存コードの規約だけを優先し、このスキルの pattern reference を無理に使わない。
references/decision-matrix.md を読み、問題領域から参照候補を 1〜4 件に絞る。
React 固有の話は references/react/index.md、Vue 固有の話は references/vue/index.md、framework-agnostic な JavaScript / loading / bundle / web platform の話は references/javascript/index.md を入口にする。
典型例:
選んだ reference の Original Skill Metadata と original-skill-body を読む。
index.md や decision-matrix.md は入口であり、実装判断の根拠は個別 reference に置く。
複数 reference が必要な場合も、まず最小数で判断する。 例えば React の render 問題に bundle 問題が混ざっているときは、render optimization と dynamic import の両方を読むが、無関係な design pattern reference は読まない。
実装・リファクタリングの場合:
レビューの場合:
変更後は対象プロジェクトに存在するコマンドを確認し、変更内容に合う検証を行う。
候補:
npm run lint
npm run test
npm run typecheck
npm run build
UI や browser behavior を変更した場合は、可能ならローカル実行とブラウザ確認も行う。 検証できない場合は、実行できなかった理由と未検証範囲を報告する。
references/decision-matrix.md から必要な reference を選んでいるoriginal-skill-body を読んでいるNo reviews yet. Tell others what you thought.
No login needed. Share how it worked for you, ask a question, or note where it did not run.
No comments yet. Be the first to write one.
Rebuild a degraded AI image to remove crunchy textures and repeated-edit artifacts while preserving identity, style, and composition. Use for clean remakes, not ordinary retouching or upscaling.
The English summary is being prepared. Showing the original description.
セミナー・講義・ウェビナー・研修・実演動画をローカルで文字起こしし、内容を分析して、必要なスライド画像や動画クリップ付きのHTML／Markdown資料を作る。動画から学習資料・実践ガイドを作りたい場合に使う。映像作品の再現設計やCanvas生成は対象外。
The English summary is being prepared. Showing the original description.
責務・依存方向・状態や副作用の境界を監査し、既存挙動を保って段階的にリファクタリングする。read-only監査にも対応する。
The English summary is being prepared. Showing the original description.
AGENTS.mdや既存スキルをGPT-6 Astra向けに監査・整理するときに使う。契約と意図的な他モデル委譲を保ち、重複、過剰な手順、曖昧な停止条件を修正する。
The English summary is being prepared. Showing the original description.
人物の参照写真から、同一性を保った複数アングルのキャラクターシートを生成・修正する。指定された身だしなみや撮影表現も整える。
The English summary is being prepared. Showing the original description.
既存キャラクター画像を、承認制でピクセルアートの正準画像へ変換し、3状態パイロット、クロマ前処理、状態間ジオメトリ検証、9状態生成、遷移QA、仮配置、アプリ内確認、ロールバック可能な正式配置まで行う。キャラクターからCodexペットを作る依頼に加え、ジャンプで小さくなる、状態ごとに身長が変わる、足元が跳ねる、クロマ縁が出る、アニメーションを修復したい依頼で使用する。
The English summary is being prepared. Showing the original description.