Topic

React

Component patterns, hooks, and React best practices

Skills in this topic

#

Skill

Source

8W Activity

Installs

vercel-react-best-practices Official

vercel-labs/agent-skills

lark-event Lark/Feishu real-time event listening / subscribing / consuming: stream events as NDJSON via `lark-cli event consume …

azure-hosted-copilot-sdk Official

microsoft/azure-skills

lark-event Lark/Feishu real-time event listening / subscribing / consuming: stream events as NDJSON via `lark-cli event consume …

hyperframes-creative Non-animation creative direction for HyperFrames videos.

heygen-com/hyperframes

vercel-composition-patterns Official

vercel-labs/agent-skills

remotion-to-hyperframes Port an existing Remotion (React) composition''s source to HyperFrames HTML. Use ONLY on an explicit ask to port/conv…

heygen-com/hyperframes

supabase Official Use when doing ANY task involving Supabase. Triggers: Supabase products (Database, Auth, Edge Functions, Realtime, St…

supabase/agent-skills

vercel-react-native-skills Official

vercel-labs/agent-skills

vercel-react-view-transitions Official

vercel-labs/agent-skills

better-auth-best-practices Official

better-auth/skills

web-artifacts-builder Official Suite of tools for creating elaborate, multi-component claude.ai HTML artifacts using modern frontend web technologie…

anthropics/skills

design-mobile-apps Use when the user wants to design a mobile app or UI screens, when they mention their Sleek (sleek.design) projects, …

designed-by-ai/skills

convex-performance-audit

get-convex/agent-skills

convex Convex is the backend agents get right on the first try: an all-TypeScript reactive platform where the database, serv…

get-convex/agent-skills

solana-dev Use when user asks to "build a Solana dapp", "write an Anchor program", "create a token", "debug Solana errors", "set…

solana-foundation/solana-dev-skill

coreyhaines31/marketingskills

opentui OpenTUI skill for building terminal user interfaces with the Core, React, or Solid APIs. Use for any TUI task includi…

msmps/opentui-skill

gsap-core Official GSAP skill for the core API — gsap.to(), from(), fromTo(), easing, duration, stagger, defaults, gsap.matchMe…

greensock/gsap-skills

expo-tailwind-setup Official

ai-sdk Official

shadcn-ui Official

google-labs-code/stitch-skills

react:components Official Converts Stitch designs into modular Vite and React components using system-level networking and AST-based validation.

google-labs-code/stitch-skills

ask-sonner Guide to Sonner, the React toast library — install and wire up the Toaster, pick the right toast() call, promise and …

emilkowalski/skills

gsap-react Official GSAP skill for React — useGSAP hook, refs, gsap.context(), cleanup. Use when the user wants animation in Rea…

greensock/gsap-skills

native-data-fetching Official

gsap-frameworks Official GSAP skill for Vue, Svelte, and other non-React frameworks — lifecycle, scoping selectors, cleanup on unmoun…

greensock/gsap-skills

upgrading-expo Official

clerk-setup Official

animate-expo Build animations in React Native and Expo, making the decisions in the order that determines whether they feel right …

emilkowalski/skills

golang-samber-ro Reactive streams and event-driven programming in Golang using samber/ro — ReactiveX implementation with 150+ type-saf…

samber/cc-skills-golang

angular-developer Generates Angular code and provides architectural guidance. Trigger when creating projects, components, services, or …

vue Vue 3 Composition API, script setup macros, reactivity system, and built-in components. Use when writing Vue SFCs, de…

use-dom Official

nextjs-app-router-patterns

wshobson/agents

gws-events-renew Official Google Workspace Events: Renew/reactivate Workspace Events subscriptions.

googleworkspace/cli

react-native-best-practices Official Provides React Native performance optimization guidelines for FPS, TTI, bundle size, memory leaks, re-renders, and an…

callstackincubator/agent-skills

laravel-specialist Build and configure Laravel 10+ applications, including creating Eloquent models and relationships, implementing Sanc…

jeffallan/claude-skills

giuseppe-trisciuoglio/developer-kit

expo-brownfield Official Framework (OSS). Integrate Expo and React Native into an existing native iOS or Android app. Use when the user mentio…

extension-core-infrastructure Core infrastructure providing backend connection configuration, storage client, and React app entry point.

caffeinelabs/skills

convex-design Design and build reactive, type-safe, production-grade backends on Convex. Covers schema, queries/mutations/actions, …

get-convex/agent-skills

convex-monitor Watch for the next dev/prod error or request in a Convex app and react to it.

get-convex/agent-skills

javascript-testing-patterns

wshobson/agents

tailwind-css-patterns

giuseppe-trisciuoglio/developer-kit

argent-react-native-optimization Optimizes a React Native app by profiling first to find real bottlenecks, then sweeping for mechanical issues. Entry-…

software-mansion/argent

argent-react-native-app-workflow Step-by-step workflows for developing or debugging React Native apps on iOS simulator or Android emulator. Use when s…

software-mansion/argent

argent-react-native-profiler Profile a React Native Hermes app to measure re-render and CPU performance using argent profiler tools. Use when opti…

software-mansion/argent

argent-metro-debugger Debug a JS runtime via CDP using argent debugger tools. Primary path is React Native via Metro (iOS / Android / Vega)…

software-mansion/argent

clerk-react-patterns Official React SPA auth patterns with @clerk/react for Vite/CRA - ClerkProvider setup, useAuth/useUser/useClerk hooks, React R…

vue-pinia-best-practices Pinia stores, state management patterns, store setup, and reactivity with stores.

vuejs-ai/skills

expo-data-fetching Official Framework (OSS). Use when implementing or debugging ANY network request, API call, or data fetching. Covers fetch API…

frontend-design Official

anthropics/claude-plugins-official

react-doctor Use when finishing a feature, fixing a bug, before committing React code, or when the user types `/doctor`, asks to s…

millionco/react-doctor

php-pro Use when building PHP applications with modern PHP 8.3+ features, Laravel, or Symfony frameworks. Invokes strict typi…

jeffallan/claude-skills

react-native-design

wshobson/agents

design-system-patterns

wshobson/agents

migrate-radix-to-base Migrates React projects and components from Radix UI to Base UI. Use when asked to migrate from radix, move to base-u…

react-native-architecture

wshobson/agents

react-state-management

wshobson/agents

interaction-design

wshobson/agents

frontend-patterns Frontend development patterns for React, Next.js, state management, performance optimization, and UI best practices. …

clerk-react-router-patterns Official React Router v7/v8 patterns with Clerk — rootAuthLoader, getAuth in loaders, clerkMiddleware, protected routes, SSR u…

hono Use when building Hono web applications or when the user asks about Hono APIs, routing, middleware, JSX, validation, …

yusukebe/hono-skill

migrate-radix-to-base Migrates React projects and components from Radix UI to Base UI. Use when asked to migrate from radix, move to base-u…

clerk-tanstack-patterns Official TanStack React Start auth patterns with @clerk/tanstack-react-start - createServerFn, beforeLoad guards, loaders, Vin…

create-adaptable-composable Create a library-grade Vue composable that accepts maybe-reactive inputs (MaybeRef / MaybeRefOrGetter) so callers can…

vuejs-ai/skills

langchain-architecture

wshobson/agents

web-component-design

wshobson/agents

stock-analysis Analyze stocks and cryptocurrencies using Yahoo Finance data. Supports portfolio management (create, add, remove asse…

gracefullight/stock-checker

react-modernization Upgrade React applications to latest versions, migrate from class components to hooks, and adopt concurrent features.…

wshobson/agents

tanstack-query-best-practices TanStack Query (React Query) best practices for data fetching, caching, mutations, and server state management. Activ…

deckardger/tanstack-agent-skills

clerk-expo Official Add Clerk authentication to Expo and React Native apps using @clerk/expo. Use for Expo setup, prebuilt native compone…

heroui-react HeroUI v3 React component library (Tailwind CSS v4 + React Aria).

heroui-inc/heroui

expo-web-to-native Official Framework (OSS). Migrate an existing web React app to a native iOS/Android app with Expo. Use when the user wants to …

java-coding-standards Java coding standards for Spring Boot and Quarkus services: naming, immutability, Optional usage, streams, exceptions…

vue-jsx-best-practices JSX syntax in Vue (e.g., class vs className, JSX plugin config).

vuejs-ai/skills

upgrading-react-native Official Upgrades React Native apps to newer versions by applying rn-diff-purge template diffs, updating package.json dependen…

callstackincubator/agent-skills

heroui-native HeroUI Native component library for React Native (Tailwind v4 via Uniwind).

heroui-inc/heroui

folder-structure-blueprint-generator Official Comprehensive technology-agnostic prompt for analyzing and documenting project folder structures. Auto-detects projec…

github/awesome-copilot

project-workflow-analysis-blueprint-generator Official Comprehensive technology-agnostic prompt generator for documenting end-to-end application workflows. Automatically de…

github/awesome-copilot

tanstack-start-best-practices TanStack Start best practices for full-stack React applications. Server functions, middleware, SSR, authentication, a…

deckardger/tanstack-agent-skills

design-motion-principles Motion and interaction design expert based on Emil Kowalski, Jakub Krehel, and Jhey Tompkins' techniques. Two modes —…

kylezantos/design-motion-principles

technology-stack-blueprint-generator Official Comprehensive technology stack blueprint generator that analyzes codebases to create detailed architectural documenta…

github/awesome-copilot

code-exemplars-blueprint-generator Official Technology-agnostic prompt generator that creates customizable AI prompts for scanning codebases and identifying high…

github/awesome-copilot

java-mcp-server-generator Official Generate a complete Model Context Protocol server project in Java using the official MCP Java SDK with reactive strea…

github/awesome-copilot

emblem-ai-react React integration skill for EmblemAI's one-shot user management.

emblemcompany/agent-skills

emblem-ai One-shot user management for apps, multi-chain wallet authentication, an AI-powered assistant, and AI app introspecti…

emblemcompany/agent-skills

react-email Official Use when building HTML email templates with React components, adding a visual email editor to an application using th…

resend/resend-skills

react Official React renderer for json-render that turns JSON specs into React components. Use when working with @json-render/react,…

vercel-labs/json-render

daisyui Official daisyUI component-library skill for Tailwind CSS. When you write HTML or JSX code, you must use it. Even if …

saadeghi/daisyui

react-email Official Use when building HTML email templates with React components, adding a visual email editor to an application using th…

resend/react-email

typescript-react-reviewer Expert code reviewer for TypeScript + React 19 applications. Use when reviewing React code, identifying anti-patterns…

dotneet/claude-code-marketplace

documentation-lookup Use up-to-date library and framework docs via Context7 MCP instead of training data. Activates for setup questions, A…

angular-signals DEPRECATED - this skill is unmaintained.

analogjs/angular-skills

fullstack-developer Modern web development expertise covering React, Node.js, databases, and full-stack architecture. Use when: building …

shubhamsaboo/awesome-llm-apps

stitch::extract-design-md Official Extract a comprehensive design system (DESIGN.md) directly from frontend source code — React, Vue, Svelte, Angular, p…

google-labs-code/stitch-skills

github-actions Official GitHub Actions workflow patterns for React Native iOS simulator and Android emulator cloud builds with downloadable a…

callstackincubator/agent-skills

remotion-video-creation Best practices for Remotion - Video creation in React. 29 domain-specific rules covering 3D, animations, audio, capti…