Does it include performance optimization rules?

Absolutely. It enforces state colocation, lazy initialization, list virtualization via @tanstack/react-virtual, and leverages the React Compiler for automatic memoization.

How does it handle state management?

It follows a structured approach using Zustand for global UI state, TanStack Query v5 for server data, and nuqs for managing state via URLs.

Does this skill support the latest React 19 features?

Yes, it fully supports React 19.2+ features including use(), Actions, useOptimistic, useActionState, and integration with the React Compiler.

What are the TypeScript requirements?

The skill enforces TypeScript 5.x in strict mode, utilizing discriminated unions for props and preventing unsafe type assertions or 'any' types.

Should I use this for Next.js or MUI development?

This skill is designed for pure React patterns. For Next.js and Material UI specific workflows, it is recommended to use the nextjs-ui-dev skill instead.

React 19 Development & Optimization

Name: React 19 Development & Optimization
Author: sellernote

bysellernote

•

Herramientas para Desarrolladores

Develops high-performance React 19 components and custom hooks using modern patterns and strict TypeScript conventions.

This skill equips Claude with the expertise to architect and build robust React 19 applications following industry-standard Sellernote conventions. It streamlines the creation of sophisticated UI components, custom hooks, and performance-tuned logic by leveraging the latest React 19 features like the React Compiler, Actions, and the use() hook. By enforcing strict TypeScript integration, state colocation, and declarative error handling with Suspense and Error Boundaries, it ensures that every line of code is maintainable, performant, and aligned with modern frontend best practices.

Características Principales

01Advanced component architecture using Compound Component and Children Composition patterns

02Standardized state management with Zustand, TanStack Query v5, and nuqs

03Automated performance optimization leveraging the React Compiler and virtualization

041 GitHub stars

05React 19 feature integration including Actions, useOptimistic, and useActionState

06Strict TypeScript 5.x integration for type-safe props, hooks, and event handling

Casos de Uso

01Refactoring legacy React code to modern React 19 standards and performance benchmarks

02Building complex, reusable UI components with logic-separated Compound patterns

03Designing custom hooks for shared business logic, form validation, or API synchronization

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add sellernote/sellernote-vibecode-plugin react-dev

For use in Claude.ai and ChatGPT

Download Skill