インストール可能な Skill Pack

フロントエンドエンジニア Agent パック

React、Next.js、デザインシステム、コンポーネント品質、ブラウザ検証のための Skill Pack。

「フロントエンドエンジニア」のための、監査可能な出発点です。

10
選定 Skill
4
インストール順
76K
採用シグナル

実行順

Agent による Pack の使い方

  1. 01

    目的を定義

    インストール前に仕事、制約、必要な根拠を明確にします。

  2. 02

    Skill を選択

    品質、信頼、保守シグナルが明確な少数の Skill を選びます。

  3. 03

    安全に実行

    管理されたワークスペースで必要なファイルだけを使い、権限を先に確認します。

  4. 04

    結果を検証

    出力と結果を確認し、リスクの高い箇所には人の承認を残します。

適した用途

  • フロントエンドエンジニア のワークフロー
  • 品質・信頼・監査シグナルを確認した選定
  • 管理されたワークスペースでの試行

先に確認する場合

  • 機密データや本番認証情報への未確認アクセスが必要な場合
  • ソース、権限、出力をレビューできない場合

Agent インストール計画

Agent が実行できる機械可読の計画。

Pack API はインストール順、監査 URL、レビュー項目、結果報告契約を返します。まずこのページで文脈を把握し、正確な JSON 計画は API から取得してください。

テキスト計画を開く

インストール順

  1. 01
    Playwright

    信頼 80/100 · 監査 89/100 · 試用可能

    npx skills add microsoft/playwright
  2. 02
    Skills

    信頼 87/100 · 監査 92/100 · 試用可能

    npx skills add davidondrej/skills
  3. 03
    Agent Skills

    信頼 88/100 · 監査 92/100 · 要レビュー

    npx skills add addyosmani/agent-skills
  4. 04
    Vercel React Best Practices

    信頼 91/100 · 監査 94/100 · 試用可能

    npx skills add vercel-labs/agent-skills --skill vercel-react-best-practices

レビュー項目

  • インストール前に、選定した各 Skill の監査 URL を開いてください。
  • まずはサンドボックス、ローカルブランチ、または破棄可能なワークスペース内でインストールします。
  • ライセンス、最近のリポジトリ活動、README/SKILL.md の完全性、依存関係の範囲を確認します。
  • 本番ワークフローで使う前に、範囲の狭いタスクを一つ実行します。
  • 成功、設定上の摩擦、リスクによる停止、低品質な出力を結果エンドポイントに報告します。

結果エンドポイント

POST https://www.openagentskill.com/api/agent/outcome

推奨 Skill

この Pack のインストール候補

Pack API を開く
#1

Playwright

品質 100信頼 80監査 89

リポジトリ説明(原文)

Reliable browser automation and testing engine for web agent tasks.

76K Stars試用可能Apache-2.0

インストール

npx skills add microsoft/playwright
#2

Skills

品質 100信頼 87監査 92

リポジトリ説明(原文)

access to david ondrej's personal agent skills

2.7K Stars試用可能MIT

インストール

npx skills add davidondrej/skills
#3

Agent Skills

品質 100信頼 88監査 92

リポジトリ説明(原文)

Production-grade engineering skills for AI coding agents.

88K Stars要レビューMIT

インストール

npx skills add addyosmani/agent-skills
#4

Vercel React Best Practices

品質 100信頼 91監査 94

リポジトリ説明(原文)

React and Next.js performance guidance for writing, reviewing, and refactoring production UI code.

30K Stars試用可能MIT

インストール

npx skills add vercel-labs/agent-skills --skill vercel-react-best-practices
#5

Next

品質 100信頼 87監査 93

リポジトリ説明(原文)

🦍 A configurable component library for web built on React.

4.7K Stars試用可能MIT

インストール

npx skills add alibaba-fusion/next
#6

Webapp Testing

品質 100信頼 87監査 92

リポジトリ説明(原文)

Use Playwright to interact with and test local web applications, capture screenshots, debug UI behavior, and inspect browser logs.

170K Stars試用可能Source terms (see LICENSE.txt)

インストール

npx skills add anthropics/skills --skill webapp-testing
#7

Material Ui

品質 100信頼 90監査 92

リポジトリ説明(原文)

Material UI: Comprehensive React component library that implements Google's Material Design. Free forever.

98K Stars試用可能MIT

インストール

npx skills add mui/material-ui
#8

Daisyui

品質 100信頼 90監査 92

リポジトリ説明(原文)

🌼 🌼 🌼 🌼 🌼  The most popular, free and open-source Tailwind CSS component library

41K Stars試用可能MIT

インストール

npx skills add saadeghi/daisyui
#9

Chakra Ui

品質 100信頼 88監査 91

リポジトリ説明(原文)

Chakra UI is a component system for building SaaS products with speed ⚡️

40K Stars試用可能MIT

インストール

npx skills add chakra-ui/chakra-ui
#10

Refine

品質 100信頼 90監査 92

リポジトリ説明(原文)

A React Framework for building internal tools, admin panels, dashboards & B2B apps with unmatched flexibility.

35K Stars試用可能MIT

インストール

npx skills add refinedev/refine