react-typescript-patterns

Document React 19 and TypeScript patterns with Vike SSR and TanStack Query.

5|Updated Mar 30, 2026
One-click install
npx skills add https://github.com/jeanpaulsio/nunchuck-skills --skill react-typescript-patterns-jeanpaulsio
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: react-typescript-patterns
Source: https://github.com/jeanpaulsio/nunchuck-skills/tree/main/skills/react-typescript-patterns
Command: npx skills add https://github.com/jeanpaulsio/nunchuck-skills --skill react-typescript-patterns-jeanpaulsio

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Provide a centralized, production-ready reference for React and TypeScript patterns that ensures consistency and accelerates onboarding across frontend projects.

Core Features & Use Cases

  • Production-grade patterns for React 19, TypeScript, Vike SSR, and TanStack Query data fetching.
  • Guidance on component composition, hooks, testing with Vitest/RTL, accessibility, and performance optimization.
  • Use cases include scaffolding new features, code reviews, and developer onboarding across teams.

Quick Start

Ask the agent to apply React/TypeScript patterns to your production app and scaffold example components.

Frequently Asked Questions about react-typescript-patterns

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
What are production-grade React and TypeScript patterns for component composition?▼

Production-grade React and TypeScript patterns provide centralized references for component composition, hooks, and accessibility to ensure consistency across frontend teams building React 19 applications.

How do I scaffold new React 19 features using TypeScript and Vike SSR?▼

To scaffold new React 19 features, apply production-ready TypeScript patterns that integrate Vike SSR for server-side rendering and TanStack Query for data fetching to ensure scalable component architecture.

Does this React TypeScript pattern reference include Vitest and RTL testing guidance?▼

Yes, the React TypeScript pattern reference includes comprehensive testing guidance using Vitest and React Testing Library (RTL) to validate component behavior and ensure accessibility compliance across your application.

Can I use these React and TypeScript patterns for team onboarding and code reviews?▼

Yes, you can use these React and TypeScript patterns during team onboarding and code reviews to enforce production-ready standards, ensuring consistent component composition and accessibility best practices across developers.

What's the best way to structure TanStack Query data fetching in a React TypeScript app?▼

The best way to structure TanStack Query data fetching involves applying production-grade TypeScript patterns that standardize hook usage and component composition, ensuring maintainable and performant data layer implementation.