Skip to content

skills-setup.md

Latest commit

 

History

History
88 lines (62 loc) · 3.05 KB

skills-setup.md

File metadata and controls

88 lines (62 loc) · 3.05 KB

Recommended Agent Skills (skills.sh)

skills.sh is an open ecosystem for curated agent skills — reusable procedural knowledge that helps coding agents work more effectively with specific tools and frameworks.

Install skills with the skills CLI (npx skills). Skills are installed as markdown files into your agent's configuration directory.

Recommended Skills for StreamKit

For UI Work (React, Frontend)

StreamKit's UI uses React 19, Zustand, Jotai, and Radix UI. These skills provide best practices for React development:

# React patterns, hooks, and performance best practices
npx skills add vercel-labs/agent-skills --skill react-best-practices -y

# Component composition and code organization patterns
npx skills add vercel-labs/agent-skills --skill composition-patterns -y

# Visual design and CSS/layout guidelines
npx skills add vercel-labs/agent-skills --skill web-design-guidelines -y

For E2E Testing (Playwright)

StreamKit uses Playwright for end-to-end tests. This skill provides patterns for browser automation and testing:

# Playwright-based webapp testing patterns
npx skills add anthropics/skills --skill webapp-testing -y

Install All Recommended Skills at Once

npx skills add vercel-labs/agent-skills \
  --skill react-best-practices \
  --skill composition-patterns \
  --skill web-design-guidelines -y

npx skills add anthropics/skills --skill webapp-testing -y

How Skills Work

  • Skills are stored in GitHub repositories as SKILL.md files
  • npx skills add clones the skill into your agent's config directory
  • Skills are agent-agnostic — they work with Claude Code, Cursor, Codex, Windsurf, and others
  • Use npx skills list to see installed skills
  • Use npx skills update to update to latest versions
  • Use npx skills find <query> to discover new skills

Important: Install Location

Do not install skills into .claude/skills/ — that directory is repo-maintained and contains committed skills that symlink to agent_docs/. Running npx skills add there will mix vendored content into the tracked tree.

Install user/third-party skills into a personal (non-tracked) location instead. For Claude Code, use ~/.claude/skills/ (user-level). For other agents, use the agent's per-user config directory.

Repo-Maintained Skills

StreamKit maintains two sets of committed skills:

  • .claude/skills/ — Agent Skills standard (SKILL.md + frontmatter). Each skill is a thin wrapper that symlinks guide.md → agent_docs/<name>.md so Claude Code gets progressive disclosure with zero duplication.
  • .agents/skills/ — Devin-specific testing workflows (compositor UI, stream views). Follow the existing pattern when adding new Devin skills.

For skills that should work across multiple agents, use the SKILL.md format in .claude/skills/ with a symlink to the canonical guide in agent_docs/.

Learn more: skills.sh documentation