react-dev
This skill should be used when building React components with TypeScript, typing hooks, handling events, or when React TypeScript, React 19, Server Components are mentioned. Covers type-safe patterns for React 18-19 including generic components, proper event typing, and routing
Installation
Pick a client and clone the repository into its skills directory.
Installation
About this skill
This skill should be used when building React components with TypeScript, typing hooks, handling events, or when React TypeScript, React 19, Server Components are mentioned. Covers type-safe patterns for React 18-19 including generic components, proper event typing, and routing integration (TanStack Router, React Router).
How to use
Aktywuj skill react-dev w swoim projekcie React z TypeScriptem, gdy planujesz budować komponenty, implementować hooki lub pracować z routingiem. Skill automatycznie zasugeruje się w kontekście React TypeScript, React 19 lub Server Components.
Dla komponentów z referencjami: w React 19 przekaż ref jako zwykłą właściwość zamiast używać forwardRef. Zdefiniuj typ props zawierający opcjonalny ref i rozpakuj go w funkcji komponentu.
Przy obsłudze formularzy: zastąp useFormState na useActionState, który zwraca krotkę [state, formAction, isPending]. Przekaż formAction do atrybutu action formularza.
Dla asynchronicznych danych: użyj hook use() do rozpakowania Promise lub kontekstu wewnątrz komponentu. Komponent zawiesi się do czasu rozwiązania Promise.
Typuj event handlery precyzyjnie: dla onClick użyj React.MouseEvent
, dla onChange w input użyj React.ChangeEvent . Generyczne komponenty deklaruj z ograniczeniami typu, np. . Przy integracji routera: skonsultuj się ze skill'm w kontekście TanStack Router lub React Router, aby uzyskać wzorce typowania dla parametrów trasy i nawigacji.