Community코딩 & 개발github.com

pproenca/react-hook-form

클라이언트 측 폼 검증을 위한 React Hook Form 성능 최적화 스킬로, useForm, useWatch, useController, useFieldArray 및 v7.55+ subscribe() API를 다룹니다.

react-hook-form란 무엇인가요?

이 스킬은 React Hook Form 라이브러리를 사용하여 클라이언트 측 제어 폼(controlled forms)을 구축할 때 성능을 최적화하는 방법을 제공합니다. useForm, useWatch, useController, useFieldArray와 같은 핵심 훅과 v7.55부터 도입된 subscribe() API를 활용하여 불필요한 리렌더링을 최소화하고 폼 상태 관리를 효율적으로 처리합니다. React Hook Form을 사용하는 모든 React 프로젝트(React 19 포함)에서 적용 가능하며, 특히 복잡한 폼이나 많은 입력 필드가 있는 경우 유용합니다. 단, 이 스킬은 React 19 Server Actions, useActionState, 또는 서버 측 폼 처리는 다루지 않으므로 해당 기능이 필요하면 별도의 react-19 스킬을 사용해야 합니다.

지원 대상~Claude Code~Codex CLI~Cursor
Part ofReact
npx skills add https://github.com/pproenca/dot-skills/tree/main/skills/react-hook-form

Installed? Explore more 코딩 & 개발 skills: steipete/bluebubbles, steipete/eightctl, steipete/blucli · View all 6 →

즐겨 사용하는 AI에게 물어보기

이 에이전트 스킬이 미리 로드된 새 채팅을 엽니다.

문서

react-hook-form은(는) 무엇을 하나요?

React Hook Form 성능 최적화를 위한 클라이언트 측 폼 검증 스킬입니다. useForm, useWatch, useController, useFieldArray와 v7.55+ subscribe() API를 사용합니다. 이 스킬은 React Hook Form 라이브러리로 클라이언트 측 제어 폼을 구축할 때 사용해야 합니다. 이 스킬은 React 19 Server Actions, useActionState, 또는 서버 측 폼 처리를 다루지 않습니다 (해당 기능은 react-19 스킬을 사용하세요).

Individual skills in this repo

This repo contains 7 individual skills — each has its own dedicated page.

pproenca/clean-architecture

Clean Architecture principles and best practices from Robert C. Martin's book. This skill should be used when designing software systems, reviewing code structure, or refactoring applications to achieve better separation of concerns. Triggers on tasks involving layers, boundaries, dependency direction, entities, use cases, or system architecture.

pproenca/code-simplifier

Code simplification skill for improving clarity, consistency, and maintainability while preserving exact behavior. Use when simplifying code, reducing complexity, cleaning up recent changes, applying refactoring patterns, or improving readability. Triggers on tasks involving code cleanup, simplification, refactoring, or readability improvements.

pproenca/emilkowal-animations

Emil Kowalski's animation best practices for web interfaces. Use when writing, reviewing, or implementing animations in React, CSS, or Framer Motion. Triggers on tasks involving transitions, easing, gestures, toasts, drawers, or motion.

pproenca/nuqs

nuqs (type-safe URL query state) best practices for Next.js and other React frameworks. This skill should be used when writing, reviewing, or refactoring code that uses nuqs for URL state management. Triggers on tasks involving useQueryState, useQueryStates, search params, URL state, query parameters, nuqs parsers, limitUrlUpdates, Standard Schema, NuqsAdapter, or Next.js routing with state.

pproenca/typescript

TypeScript performance, tsconfig, type errors, async patterns — triggered when the user asks to "optimize TypeScript performance", "speed up tsc compilation", "configure tsconfig.json", "fix type errors", "improve async patterns", or encounters TS errors (TS2322, TS2339, "is not assignable to"). Also triggers on .ts, .tsx, .d.ts file work involving type definitions, module organization, or memory management. Does NOT cover TypeScript basics, framework-specific patterns, or testing.

pproenca/vitest

Vitest testing framework patterns for test setup, async testing, mocking with vi.*, snapshots, and test performance (formerly test-vitest). This skill should be used when writing or debugging Vitest tests. This skill does NOT cover TDD methodology (use test-tdd skill), API mocking with MSW (use test-msw skill), or Jest-specific APIs.

pproenca/zod

Zod schema validation best practices for type safety, parsing, and error handling. This skill should be used when defining z.object schemas, using z.string validations, safeParse, or z.infer. This skill does NOT cover React Hook Form integration patterns (use react-hook-form skill) or OpenAPI client generation (use orval skill).

관련 스킬