React

React skills teach your agent component patterns, hooks, performance rules, and ecosystem conventions for production-quality UI.

이 주제의 228개 스킬

에이전트가 할 수 있는 작업

  • Compose reusable components with modern React patterns
  • Apply hooks and state management best practices
  • Optimize rendering with memo, lazy loading, and profiling
  • Handle server and client component boundaries in modern stacks
  • Write accessible JSX with semantic markup
  • Test React components with Vitest and Testing Library

이 주제의 스킬

steipete/slack

Slack tool actions: send/read/edit/delete messages, react, pin/unpin, list pins/reactions/emoji, member info.

steipete/clawdis

npx skills add steipete/clawdis

steipete/discord

Discord message-tool ops: send/read/edit/delete, react, poll, pin, thread, search, presence, media/components.

steipete/clawdis

npx skills add steipete/clawdis

affaan-m/motion-foundations

Motion tokens, spring presets, performance rules, device adaptation, accessibility enforcement, and SSR safety for React / Next.js using motion/react. Foundation layer — all other motion skills depend on this.

affaan-m/everything-claude-code

npx skills add affaan-m/everything-claude-code

affaan-m/java-coding-standards

Java coding standards for Spring Boot and Quarkus services: naming, immutability, Optional usage, streams, exceptions, generics, CDI, reactive patterns, and project layout. Automatically applies framework-specific conventions.

affaan-m/everything-claude-code

npx skills add affaan-m/everything-claude-code

affaan-m/coding-standards

Baseline cross-project coding conventions for naming, readability, immutability, and code-quality review. Use detailed frontend or backend skills for framework-specific patterns.

affaan-m/everything-claude-code

npx skills add affaan-m/everything-claude-code

vercel/next.js

The React Framework

vercel/next.js

npx skills add vercel/next.js

sickn33/frontend-dev-guidelines

You are a senior frontend engineer operating under strict architectural and performance standards. Use when creating components or pages, adding new features, or fetching or mutating data.

sickn33/antigravity-awesome-skills

npx skills add sickn33/antigravity-awesome-skills

sickn33/discord-bot-architect

Specialized skill for building production-ready Discord bots. Covers Discord.js (JavaScript) and Pycord (Python), gateway intents, slash commands, interactive components, rate limiting, and sharding.

sickn33/antigravity-awesome-skills

npx skills add sickn33/antigravity-awesome-skills

sickn33/3d-web-experience

Expert in building 3D experiences for the web - Three.js, React Three Fiber, Spline, WebGL, and interactive 3D scenes. Covers product configurators, 3D portfolios, immersive websites, and bringing depth to web experiences.

sickn33/antigravity-awesome-skills

npx skills add sickn33/antigravity-awesome-skills

sickn33/nextjs-best-practices

Next.js App Router principles. Server Components, data fetching, routing patterns.

sickn33/antigravity-awesome-skills

npx skills add sickn33/antigravity-awesome-skills

github/unit-test-vue-pinia

Write and review unit tests for Vue 3 + TypeScript + Vitest + Pinia codebases. Use when creating or updating tests for components, composables, and stores; mocking Pinia with createTestingPinia; applying Vue Test Utils patterns; and enforcing black-box assertions over implementation details.

github/awesome-copilot

npx skills add github/awesome-copilot

github/oo-component-documentation

Create or update standardized object-oriented component documentation using a shared template plus mode-specific guidance for new and existing docs.

github/awesome-copilot

npx skills add github/awesome-copilot

github/web-coder

Expert 10x engineer with comprehensive knowledge of web development, internet protocols, and web standards. Use when working with HTML, CSS, JavaScript, web APIs, HTTP/HTTPS, web security, performance optimization, accessibility, or any web/internet concepts. Specializes in translating web terminology accurately and implementing modern web standards across frontend and backend development.

github/awesome-copilot

npx skills add github/awesome-copilot

github/update-oo-component-documentation

Update existing object-oriented component documentation following industry best practices and architectural documentation standards.

github/awesome-copilot

npx skills add github/awesome-copilot

github/msstore-cli

Microsoft Store Developer CLI (msstore) for publishing Windows applications to the Microsoft Store. Use when asked to configure Store credentials, list Store apps, check submission status, publish submissions, manage package flights, set up CI/CD for Store publishing, or integrate with Partner Center. Supports Windows App SDK/WinUI, UWP, .NET MAUI, Flutter, Electron, React Native, and PWA applications.

github/awesome-copilot

npx skills add github/awesome-copilot

github/create-oo-component-documentation

Create comprehensive, standardized documentation for object-oriented components following industry best practices and architectural documentation standards.

github/awesome-copilot

npx skills add github/awesome-copilot

CopilotKit/CopilotKit

The Frontend Stack for Agents & Generative UI. React + Angular. Makers of the AG-UI Protocol

CopilotKit/CopilotKit

npx skills add CopilotKit/CopilotKit

googleworkspace/gws-events-renew

Google Workspace Events: Renew/reactivate Workspace Events subscriptions.

googleworkspace/cli

npx skills add googleworkspace/cli

ComposioHQ/codebase-migrate

Run large codebase migrations and multi-file refactors. Uses the Composio CLI to coordinate issue tracking, batched PRs, and CI verification while the agent executes the transforms locally across hundreds of files.

ComposioHQ/awesome-codex-skills

npx skills add ComposioHQ/awesome-codex-skills

ComposioHQ/skill-creator

Guide for creating effective skills. This skill should be used when users want to create a new skill (or update an existing skill) that extends Codex's capabilities with specialized knowledge, workflows, or tool integrations.

ComposioHQ/awesome-codex-skills

npx skills add ComposioHQ/awesome-codex-skills

tambo-ai/tambo

Generative UI SDK for React

tambo-ai/tambo

npx skills add tambo-ai/tambo

jeffallan/vue-expert-js

Creates Vue 3 components, builds vanilla JS composables, configures Vite projects, and sets up routing and state management using JavaScript only — no TypeScript. Generates JSDoc-typed code with @typedef, @param, and @returns annotations for full type coverage without a TS compiler. Use when building Vue 3 applications with JavaScript only (no TypeScript), when projects require JSDoc-based type hints, when migrating from Vue 2 Options API to Composition API in JS, or when teams prefer vanilla JavaScript, .mjs modules, or need quick prototypes without TypeScript setup.

jeffallan/claude-skills

npx skills add jeffallan/claude-skills

jeffallan/vue-expert

Builds Vue 3 components with Composition API patterns, configures Nuxt 3 SSR/SSG projects, sets up Pinia stores, scaffolds Quasar/Capacitor mobile apps, implements PWA features, and optimises Vite builds. Use when creating Vue 3 applications with Composition API, writing reusable composables, managing state with Pinia, building hybrid mobile apps with Quasar or Capacitor, configuring service workers, or tuning Vite configuration and TypeScript integration.

jeffallan/claude-skills

npx skills add jeffallan/claude-skills

jeffallan/csharp-developer

Use when building C# applications with .NET 8+, ASP.NET Core APIs, or Blazor web apps. Builds REST APIs using minimal or controller-based routing, configures database access with Entity Framework Core, implements async patterns and cancellation, structures applications with CQRS via MediatR, and scaffolds Blazor components with state management. Invoke for C#, .NET, ASP.NET Core, Blazor, Entity Framework, EF Core, Minimal API, MAUI, SignalR.

jeffallan/claude-skills

npx skills add jeffallan/claude-skills

jeffallan/angular-architect

Generates Angular 17+ standalone components, configures advanced routing with lazy loading and guards, implements NgRx state management, applies RxJS patterns, and optimizes bundle performance. Use when building Angular 17+ applications with standalone components or signals, setting up NgRx stores, establishing RxJS reactive patterns, performance tuning, or writing Angular tests for enterprise apps.

jeffallan/claude-skills

npx skills add jeffallan/claude-skills

jeffallan/react-native-expert

Builds, optimizes, and debugs cross-platform mobile applications with React Native and Expo. Implements navigation hierarchies (tabs, stacks, drawers), configures native modules, optimizes FlatList rendering with memo and useCallback, and handles platform-specific code for iOS and Android. Use when building a React Native or Expo mobile app, setting up navigation, integrating native modules, improving scroll performance, handling SafeArea or keyboard input, or configuring Expo SDK projects.

jeffallan/claude-skills

npx skills add jeffallan/claude-skills

jeffallan/react-expert

Use when building React 18+ applications in .jsx or .tsx files, Next.js App Router projects, or create-react-app setups. Creates components, implements custom hooks, debugs rendering issues, migrates class components to functional, and implements state management. Invoke for Server Components, Suspense boundaries, useActionState forms, performance optimization, or React 19 features.

jeffallan/claude-skills

npx skills add jeffallan/claude-skills

jeffallan/java-architect

Use when building, configuring, or debugging enterprise Java applications with Spring Boot 3.x, microservices, or reactive programming. Invoke to implement WebFlux endpoints, optimize JPA queries and database performance, configure Spring Security with OAuth2/JWT, or resolve authentication issues and async processing challenges in cloud-native Spring applications.

jeffallan/claude-skills

npx skills add jeffallan/claude-skills

jeffallan/php-pro

Use when building PHP applications with modern PHP 8.3+ features, Laravel, or Symfony frameworks. Invokes strict typing, PHPStan level 9, async patterns with Swoole, and PSR standards. Creates controllers, configures middleware, generates migrations, writes PHPUnit/Pest tests, defines typed DTOs and value objects, sets up dependency injection, and scaffolds REST/GraphQL APIs. Use when working with Eloquent, Doctrine, Composer, Psalm, ReactPHP, or any PHP API development.

jeffallan/claude-skills

npx skills add jeffallan/claude-skills

antfu/vue-testing-best-practices

Use for Vue.js testing. Covers Vitest, Vue Test Utils, component testing, mocking, testing patterns, and Playwright for E2E testing.

antfu/skills

npx skills add antfu/skills

antfu/vue-router-best-practices

Vue Router 4 patterns, navigation guards, route params, and route-component lifecycle interactions.

antfu/skills

npx skills add antfu/skills

antfu/vue

Vue 3 Composition API, script setup macros, reactivity system, and built-in components. Use when writing Vue SFCs, defineProps/defineEmits/defineModel, watchers, or using Transition/Teleport/Suspense/KeepAlive.

antfu/skills

npx skills add antfu/skills

markdown-viewer/uml

Create UML diagrams using PlantUML syntax. Best for software modeling — Class, Sequence, Activity, State Machine, Component, Use Case, and Deployment diagrams with concise text-based notation and auto-layout.

markdown-viewer/skills

npx skills add markdown-viewer/skills

flutter/flutter-embedding-native-views

Embeds native Android, iOS, or macOS views into a Flutter app. Use when integrating complex native components like maps or web views.

flutter/skills

npx skills add flutter/skills

expo/expo-brownfield

Integrate Expo and React Native into an existing native iOS or Android app. Use when the user mentions brownfield, embedding React Native in a native app, AAR/XCFramework, or adding Expo to an existing Kotlin/Swift project. Covers both the isolated approach and the integrated approach.

expo/skills

npx skills add expo/skills

expo/use-dom

Use Expo DOM components to run web code in a webview on native and as-is on web. Migrate web code to native incrementally.

expo/skills

npx skills add expo/skills

expo/native-data-fetching

Use when implementing or debugging ANY network request, API call, or data fetching. Covers fetch API, React Query, SWR, error handling, caching, offline support, and Expo Router data loaders (`useLoaderData`).

expo/skills

npx skills add expo/skills

callstackincubator/agent-skills

A collection of agent-optimized React Native skills for AI coding assistants.

callstackincubator/agent-skills

npx skills add callstackincubator/agent-skills

blog

>

AgriciDaniel/claude-blog

npx skills add AgriciDaniel/claude-blog

blog-cannibalization

>

AgriciDaniel/claude-blog

npx skills add AgriciDaniel/claude-blog

csharp-concurrency-patterns

Choosing the right concurrency abstraction in .NET - from async/await for I/O to Channels for producer/consumer to Akka.NET for stateful entity management. Avoid locks and manual synchronization unless absolutely necessary.

Aaronontheweb/dotnet-skills

npx skills add Aaronontheweb/dotnet-skills

am-will/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.

am-will/codex-skills

npx skills add am-will/codex-skills

am-will/context7

Fetch up-to-date library documentation via Context7 CLI. Use PROACTIVELY when: (1) Working with ANY external library (React, Next.js, Supabase, etc.) (2) User asks about library APIs, patterns, or best practices (3) Implementing features that rely on third-party packages (4) Debugging library-specific issues (5) Need current documentation beyond training data cutoff (6) AND MOST IMPORTANTLY, when you are installing dependencies, libraries, or frameworks you should ALWAYS check the docs to see what the latest versions are. Do not rely on outdated knowledge. Always prefer this over guessing library APIs or using outdated knowledge.

am-will/codex-skills

npx skills add am-will/codex-skills

hfgwygey/yu-ai-agent

编程导航 2025 年 AI 开发实战新项目,基于 Spring Boot 3 + Java 21 + Spring AI 构建 AI 恋爱大师应用和 ReAct 模式自主规划智能体YuManus,覆盖 AI 大模型接入、Spring AI 核心特性、Prompt 工程和优化、RAG 检索增强、向量数据库、Tool Calling 工具调用、MCP 模型上下文协议、AI Agent 开发、Cursor AI 工具等核心知识。用一套教程将程序员必知必会的 AI 技术一网打尽,帮你成为 AI 时代企业的香饽饽,给你的简历和求职大幅增加竞争力。

hfgwygey/yu-ai-agent

npx skills add hfgwygey/yu-ai-agent

bobmatnyc/trpc-type-safety

tRPC end-to-end type-safe APIs for TypeScript with React Query integration and full-stack type safety

bobmatnyc/claude-mpm-skills

npx skills add bobmatnyc/claude-mpm-skills

clerk/clerk-expo

Implement Clerk authentication for Expo and React Native apps using @clerk/expo source-guided patterns. Use for prebuilt AuthView/UserButton or custom hook-driven auth flows. Do not use for native iOS/Swift, native Android/Kotlin, or web framework projects.

clerk/skills

npx skills add clerk/skills

clerk/clerk-astro-patterns

Astro patterns with Clerk — middleware, SSR pages, island components, API routes, static vs SSR rendering. Triggers on: astro clerk, clerk astro middleware, astro protected page, clerk island component, astro API route auth, clerk astro SSR.

clerk/skills

npx skills add clerk/skills

clerk/clerk-tanstack-patterns

TanStack React Start auth patterns with @clerk/tanstack-react-start - createServerFn, beforeLoad guards, loaders, Vinxi server. Triggers on: TanStack auth, createServerFn clerk, beforeLoad protection, TanStack Start middleware.

clerk/skills

npx skills add clerk/skills

clerk/clerk-react-router-patterns

React Router v7 patterns with Clerk — rootAuthLoader, getAuth in loaders, clerkMiddleware, protected routes, SSR user data, org switching. Triggers on: react-router auth, rootAuthLoader, getAuth loader, react-router protected route, loader authentication, SSR auth react-router.

clerk/skills

npx skills add clerk/skills

clerk/clerk-expo-patterns

Expo / React Native patterns with Clerk — SecureStore token cache, OAuth deep linking, useAuth in native, Expo Router protected routes, push notifications with user context. Triggers on: expo clerk, clerk react native, SecureStore token cache, expo router auth, OAuth deep link clerk, mobile auth clerk.

clerk/skills

npx skills add clerk/skills

Frequently asked questions

Many React skills apply broadly. For App Router-specific patterns (server components, caching), browse the Next.js topic too.

관련 주제 둘러보기

모든 주제