blackgirlbytes
29 verified skills
replay-cli
Record your application to gather performance data and debug issues. It enables users to install Replay ClI, record a session, upload and manage them.
tools
replay-cypress
Set up and configure Replay for recording Cypress tests with time-travel debugging.
development
replay-playwright
Set up and run Playwright tests with Replay Browser to record test executions for debugging and performance analysis.
development
audit-dry
DRY and abstraction audit for duplication, reusable hooks/components, and maintainability patterns. Use when looking for refactor opportunities.
development
audit-all
Orchestrate selected audit roles with fresh sub-agents, configurable model tier, and optional --dry-run/--debug validation. Use when running full multi-role audits.
development
audit-security
Security audit for OWASP Top 10 risks, auth flaws, injection vectors, and secret handling. Use when validating exploitable application security issues.
testing
create-mcp-app
This skill should be used when the user asks to "create an MCP App", "add a UI to an MCP tool", "build an interactive MCP View", "scaffold an MCP App", or needs guidance on MCP Apps SDK patterns, UI-resource registration, MCP App lifecycle, or host integration. Provides comprehensive guidance for building MCP Apps with interactive UIs.
tools
replay-cli
Record your application to gather performance data and debug issues. It enables users to install Replay ClI, record a session, upload and manage them.
tools
replay-cypress
Set up and configure Replay for recording Cypress tests with time-travel debugging.
development
shadcn
Manages shadcn components and projects — adding, searching, fixing, debugging, styling, and composing UI. Provides project context, component docs, and usage examples. Applies when working with shadcn/ui, component registries, presets, --preset codes, or any project with a components.json file. Also triggers for "shadcn init", "create an app with --preset", or "switch to --preset".
development
replay-playwright
Set up and run Playwright tests with Replay Browser to record test executions for debugging and performance analysis.
development
replay-mcp
Use Replay MCP to inspect the contents of https://replay.io recordings.
tools
vercel-react-best-practices
React and Next.js performance optimization guidelines from Vercel Engineering. This skill should be used when writing, reviewing, or refactoring React/Next.js code to ensure optimal performance patterns. Triggers on tasks involving React components, Next.js pages, data fetching, bundle optimization, or performance improvements.
development
generate-tests
Generate a complete Playwright test suite by discovering app flows, confirming a test plan, and producing runnable tests with verification steps.
testing
frontend-design
Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, or applications. Generates creative, polished code that avoids generic AI aesthetics.
development
frontend-design
Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, or applications. Generates creative, polished code that avoids generic AI aesthetics.
development
deploy-to-vercel
Deploy applications and websites to Vercel. Use when the user requests deployment actions like "deploy my app", "deploy and give me the link", "push this live", or "create a preview deployment".
development
debug-tests
Debug Playwright failures using fresh sub-agents, optional parallelism for independent failures, and --dry-run/--debug visibility.
development
create-mcp-app
This skill should be used when the user asks to "create an MCP App", "add a UI to an MCP tool", "build an interactive MCP View", "scaffold an MCP App", or needs guidance on MCP Apps SDK patterns, UI-resource registration, MCP App lifecycle, or host integration. Provides comprehensive guidance for building MCP Apps with interactive UIs.
tools
audit-principal
Principal Engineer audit covering architecture, code quality, React/Next.js patterns, and tech debt. Use for senior-level maintainability reviews.
development
audit-devops
DevOps and production-readiness audit for observability, resilience, scalability, and deployment hygiene. Use when reviewing operational risk before release.
development
audit-a11y-browser
Live browser accessibility testing with Playwright and axe-core against a running URL. Use when validating real rendered accessibility behavior.
testing
shadcn
Manages shadcn components and projects — adding, searching, fixing, debugging, styling, and composing UI. Provides project context, component docs, and usage examples. Applies when working with shadcn/ui, component registries, presets, --preset codes, or any project with a components.json file. Also triggers for "shadcn init", "create an app with --preset", or "switch to --preset".
development
audit-a11y
Accessibility audit for WCAG 2.1 AA, keyboard support, ARIA usage, and semantic HTML. Use when reviewing React/Next.js UI accessibility.
development
vercel-composition-patterns
React composition patterns that scale. Use when refactoring components with boolean prop proliferation, building flexible component libraries, or designing reusable APIs. Triggers on tasks involving compound components, render props, context providers, or component architecture. Includes React 19 API changes.
development
vercel-composition-patterns
React composition patterns that scale. Use when refactoring components with boolean prop proliferation, building flexible component libraries, or designing reusable APIs. Triggers on tasks involving compound components, render props, context providers, or component architecture. Includes React 19 API changes.
development
deploy-to-vercel
Deploy applications and websites to Vercel. Use when the user requests deployment actions like "deploy my app", "deploy and give me the link", "push this live", or "create a preview deployment".
development
vercel-react-best-practices
React and Next.js performance optimization guidelines from Vercel Engineering. This skill should be used when writing, reviewing, or refactoring React/Next.js code to ensure optimal performance patterns. Triggers on tasks involving React components, Next.js pages, data fetching, bundle optimization, or performance improvements.
development
replay-mcp
Use Replay MCP to inspect the contents of https://replay.io recordings.
tools