설치 가능한 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