Best Best AI Agent Skills for React Development

Comprehensive performance optimization guide for React and Next.js applications, maintained by Vercel. Contains 57 rules across 8 categories, prioritized by impact to guide automated refactoring and code generation.

Use this skills whenever you are dealing with Remotion code to obtain the domain-specific knowledge.

This skill guides creation of distinctive, production-grade frontend interfaces that avoid generic 'AI slop' aesthetics. Implement real working code with exceptional attention to aesthetic details and creative choices.

Composition patterns for building flexible, maintainable React components. Avoid boolean prop proliferation by using compound components, lifting state, and composing internals.

Comprehensive best practices for React Native and Expo applications covering performance, animations, UI patterns, and platform-specific optimizations.

Vue 3 best practices, common gotchas, and performance optimization.

Guide for upgrading Expo SDK and dependencies, including steps for migration and handling breaking changes.

Use this skill for ALL networking work including API requests, data fetching, caching, or network debugging.

Use EAS Build to create development clients for testing native code changes on physical devices. Use this for creating custom Expo Go clients for testing branches of your app.

This skill covers deploying Expo applications across all platforms using EAS (Expo Application Services).

This guide covers setting up Tailwind CSS v4 in Expo using react-native-css and NativeWind v5 for universal styling across iOS, Android, and Web.

Performance optimization guide for React Native applications, covering JavaScript/React, Native (iOS/Android), and bundling optimizations.

A tool to build powerful frontend claude.ai artifacts using React and TypeScript.

Build system for JavaScript/TypeScript monorepos. Turborepo caches task outputs and runs tasks in parallel based on dependency graph.

DOM components allow web code to run verbatim in a webview on native platforms while rendering as-is on web. This enables using web-only libraries in your Expo app without modification.

Vue is based on Vue 3.5, promoting the use of the Composition API along with TypeScript, and provides best practices for reactive programming.

Build production-ready design systems with Tailwind CSS, including design tokens, component variants, responsive patterns, and accessibility.

Expert guide for building accessible, customizable UI components with shadcn/ui, Radix UI, and Tailwind CSS.

Vite is a next-generation frontend build tool with fast dev server (native ESM + HMR) and optimized production builds.

This skill is a decision-and-implementation guide for VueUse composables in Vue.js / Nuxt projects. It maps requirements to the most suitable VueUse function, applies the correct usage pattern, and prefers composable-based solutions over bespoke code to keep implementations concise, maintainable, and performant.

A frontend skill focused on transforming designs into clean React components using a modular approach and automated tools for code quality.

Pinia is the official state management library for Vue, designed to be intuitive and type-safe. It supports both Options API and Composition API styles, with first-class TypeScript support and devtools integration.

Comprehensive patterns for Next.js 14+ App Router architecture, Server Components, and modern full-stack React development.

Master modern responsive design techniques to create interfaces that adapt seamlessly across all screen sizes and device contexts.

This skill enables retrieval of current documentation for software libraries and components by querying the Context7 API via curl. Use it instead of relying on potentially outdated training data.

Blazing-fast bundler for TypeScript/JavaScript libraries powered by Rolldown and Oxc.

Type-safe React = compile-time guarantees = confident refactoring.

TanStack Query is a powerful data-fetching library for React, designed to manage server state with features for mutations, caching, and background updates. It helps streamline the process of fetching, caching, and synchronizing data in React applications.

The react-useeffect skill provides guidance on the correct use of the useEffect hook in React, highlighting scenarios where it is necessary and when it is not, along with alternative approaches.

The Frontend Code Review skill helps users inspect and review frontend code, specifically targeting `.tsx`, `.ts`, and `.js` files. It offers two modes for code review: pending-change review and file-targeted review, utilizing a checklist to flag violations and suggest improvements.

Comprehensive guide for mastering modern JavaScript (ES6+) features, functional programming patterns, and best practices for writing clean, maintainable, and performant code.

Production-ready patterns for React Native development with Expo, including navigation, state management, native modules, and offline-first architecture.

Autonomous frontend builder that facilitates continuous site-building iterations using Stitch MCP tools.

Comprehensive guide to modern React state management patterns, from local component state to global stores and server state synchronization.

Master React Native styling patterns, React Navigation, and Reanimated 3 to build performant, cross-platform mobile applications with native-quality user experiences.

Build reusable, maintainable UI components using modern frameworks with clean composition patterns and styling approaches.

Tailwind CSS Component Patterns for efficient UI development, offering a variety of reusable components and spacing guidelines.

Tailwind v4 + shadcn/ui Production Stack is a production-tested setup for using Tailwind CSS version 4.1.18 with custom utility-first CSS classes. It provides detailed setup instructions, dark mode setup, and common errors with solutions, aimed at enhancing the development of user interfaces with a focus on responsive and theme-aware applications.

Master React version upgrades, class to hooks migration, concurrent features adoption, and codemods for automated transformation.

Refactor high-complexity React components in the Dify frontend codebase.

Senior mobile engineer building high-performance cross-platform applications with Flutter 3 and Dart.

Vue.js Development Guides focused on best practices for component design, reactivity, data flow, and state management in Vue.js applications.

Pinia best practices, common gotchas, and state management patterns.

Component library for Vue 3 and Nuxt 4+ built on Reka UI (headless) + Tailwind CSS v4 + Tailwind Variants.

This skill creates adaptable composables that handle both reactive and non-reactive inputs in Vue.js applications. By using this skill, developers can improve code reusability and flexibility, reducing the risk of errors associated with input reactivity.

Handles declarative animations and gesture-based interactions within Vue 3 and Nuxt projects. Developers benefit from streamlined coding for rich animations, enhancing the user experience without heavy performance costs.

Implements modern frontend development patterns specifically for React and Next.js applications. Using these patterns enhances code maintainability and performance, streamlining the development process.

Handles the creation and management of custom shaders in Three.js, enabling developers to define complex visual effects through GLSL code. By installing this skill, developers can enhance the visual fidelity of their 3D applications while gaining full control over rendering techniques and effects.

Establishes a framework for consistent coding practices and principles applicable across various programming projects. Developers gain improved code maintainability and readability, leading to faster onboarding of team members and reduced bug rates through adherence to best practices.

Facilitates the efficient construction of React 19 applications utilizing concurrent features and advanced design patterns. Developers benefit from streamlined component architecture, optimizing state management and performance, ultimately enhancing application functionality.