react-dev

Builds type-safe React applications with TypeScript and React 19 features.

Updated Feb 23, 2026
One-click install
npx skills add https://github.com/mkloz/teamforge-frontend --skill react-dev-mkloz
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: react-dev
Source: https://github.com/mkloz/teamforge-frontend/tree/main/.agents/skills/react-dev
Command: npx skills add https://github.com/mkloz/teamforge-frontend --skill react-dev-mkloz

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires react, typescript, tanstack-router, react-router-dom, and includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve?

This Skill provides comprehensive TypeScript patterns and best practices for building type-safe React applications, eliminating guesswork and catching bugs at compile-time.

Core Features & Use Cases

  • Type-safe Components: Build components with proper TypeScript types and generic patterns.
  • Event Handler Typing: Use specific event types for accurate TypeScript inference and handling.
  • Hooks Typing: Implement custom hooks with proper typing and return types.
  • Server Components: Utilize React 19 Server Components for efficient client-side rendering and server-side data fetching.
  • Routing: Implement type-safe routing with TanStack Router or React Router v7.
  • Use Cases: Ideal for developers building modern React applications with TypeScript, focusing on productivity, type safety, and maintainability.

Quick Start

To build a typed React component, activate the skill and use the trigger phrase "Build a typed React component".

Frequently Asked Questions about react-dev

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

FAQPage Schema
How do I build type-safe React components with TypeScript?

To build type-safe React components with TypeScript, you apply generic patterns and specific event types to ensure accurate compile-time inference and catch potential bugs before runtime.

What's the best way to type custom React hooks?

The best way to type custom React hooks is to explicitly define return types and enforce TypeScript inference throughout the hook logic to maintain strict type safety across components.

How do I implement type-safe routing with TanStack Router or React Router v7?

To implement type-safe routing with TanStack Router or React Router v7, you apply TypeScript patterns that enforce route parameter validation and link safety across your application navigation.

Does this support React 19 Server Components for server-side data fetching?

Yes, it supports React 19 Server Components to enable efficient server-side data fetching and rendering patterns while maintaining strict TypeScript type safety.

What TypeScript and React versions are required for type-safe development?

Type-safe development requires React 18 or 19 and TypeScript 5.0 or higher, along with router dependencies like TanStack Router or React Router v7 to function correctly.

Why are my TypeScript event handler types failing to infer correctly?

TypeScript event handler types fail to infer correctly when generic event types are used instead of specific event types tailored to the exact DOM element and interaction.