Toolverse
All skills

react-patterns

by davila7

Modern React patterns and principles. Hooks, composition, performance, TypeScript best practices.

Installation

Pick a client and clone the repository into its skills directory.

Installation

Quick info

Author
davila7
Category
Frontend
Views
45

About this skill

Modern React patterns and principles. Hooks, composition, performance, TypeScript best practices.

How to use

  1. Zainstaluj umiejętność react-patterns w swoim środowisku Claude lub kompatybilnym agencie. Umiejętność wymaga dostępu do narzędzi Read, Write, Edit, Glob i Grep do pracy z plikami projektów React.

  2. Kiedy pracujesz nad komponentem, zapytaj się o odpowiedni wzorzec – na przykład "Jaki typ komponentu powinienem użyć do tego ekranu?" lub "Kiedy wyodrębnić custom hook?". Umiejętność podpowie Ci, czy potrzebujesz Server Component, Client Component, Presentational czy Container Component.

  3. Przy zarządzaniu stanem opisz złożoność Twojego problemu. Umiejętność pomoże Ci wybrać między useState, Context, React Query/SWR, a zaawansowanymi rozwiązaniami jak Zustand czy Redux Toolkit.

  4. Jeśli pracujesz z hookami, zapytaj o reguły i wzorce – na przykład kiedy wyodrębnić useLocalStorage, useDebounce, useFetch czy useForm. Umiejętność wyjaśni, kiedy każdy z nich ma sens.

  5. Dla React 19 pytaj o nowe hooki takie jak useActionState, useOptimistic czy use – umiejętność pokaże, jak je stosować i jakie korzyści daje nowy compiler.

  6. Stosuj composition patterns – compound components, render props czy custom hooks – zamiast dziedziczenia. Umiejętność podpowie, jak elastycznie budować komponenty poprzez composition.

Related skills

browser-automation

by browserbase

Automate web browser interactions using natural language via CLI commands. Use when the user asks to browse websites, navigate web pages, extract data from websites, take screenshots, fill forms, click buttons, or interact with web applications. Triggers include \

Frontend
21175

markitdown

by K-Dense-AI

Convert various file formats (PDF, Office documents, images, audio, web content, structured data) to Markdown optimized for LLM processing. Use when converting documents to markdown, extracting text from PDFs/Office files, transcribing audio, performing OCR on images, extracting

Frontend
75173

dev-browser

by SawyerHood

Browser automation with persistent page state. Use when users ask to navigate websites, fill forms, take screenshots, extract web data, test web apps, or automate browser workflows. Trigger phrases include \

Frontend
38151

interactive-dashboard-builder

by anthropics

Build self-contained interactive HTML dashboards with Chart.js, dropdown filters, and professional styling. Use when creating dashboards, building interactive reports, or generating shareable HTML files with charts and filters that work without a server.

Frontend
2298

2d-games

by davila7

2D game development principles. Sprites, tilemaps, physics, camera.

Frontend
2674

theme-factory

by anthropics

Toolkit for styling artifacts with a theme. These artifacts can be slides, docs, reportings, HTML landing pages, etc. There are 10 pre-set themes with colors/fonts that you can apply to any artifact that has been creating, or can generate a new theme on-the-fly.

Frontend
40139