How does it help with TanStack Router?

The skill provides patterns for creating type-safe routes, validating search parameters with Zod, and using typed hooks for navigation and data loading.

Does it enforce specific coding standards?

Yes, it enforces the use of specific event types, prohibits the 'any' type in handlers, and mandates patterns like Discriminated Unions for component variants.

Can it help me with Server Components?

Absolutely. It covers async data fetching in Server Components, creating Server Actions with 'use server', and passing promises between server and client.

Does this skill support React 19 features?

Yes, it includes specific implementation patterns for React 19 features such as useActionState, the use() hook, and using ref as a regular prop.

React TypeScript Pro

Name: React TypeScript Pro
Author: outfitter-dev

byoutfitter-dev

•

デザインツール

Builds type-safe React 19 applications using modern patterns, Server Components, and TanStack Router integration.

概要

The React TypeScript Pro skill empowers Claude to architect and implement production-ready React applications using TypeScript and the latest React 19 features. It provides specialized guidance on migrating from legacy patterns like forwardRef to modern prop-based refs, implementing type-safe Server Components and Actions, and integrating seamlessly with the TanStack Router ecosystem. By enforcing strict type-safety for event handlers, hooks, and generic components, it ensures code reliability, compile-time guarantees, and easier refactoring for complex frontend projects.

主な機能

React 19 modern patterns (ref as prop, useActionState, use())
Type-safe Server Components and Server Actions
TanStack Router integration with Zod validation
Strict event handler and hook typing
Generic component architecture and discriminated unions
16 GitHub stars

ユースケース

Refactoring legacy JavaScript React codebases to type-safe TypeScript
Building a high-performance React 19 dashboard with Server Components
Implementing complex, type-safe navigation and search params with TanStack Router

概要

主な機能

React 19 modern patterns (ref as prop, useActionState, use())
Type-safe Server Components and Server Actions
TanStack Router integration with Zod validation
Strict event handler and hook typing
Generic component architecture and discriminated unions
16 GitHub stars

ユースケース

Refactoring legacy JavaScript React codebases to type-safe TypeScript
Building a high-performance React 19 dashboard with Server Components
Implementing complex, type-safe navigation and search params with TanStack Router