Toolverse
All skills

react-hook-form-writer

by dust-tt

Write and refactor React forms using react-hook-form with Zod validation. Use when creating new form components, converting existing forms to react-hook-form, or implementing form validation patterns.

Installation

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

Installation

Quick info

Author
dust-tt
Category
Frontend
Views
22

About this skill

Write and refactor React forms using react-hook-form with Zod validation. Use when creating new form components, converting existing forms to react-hook-form, or implementing form validation patterns.

How to use

  1. Zainstaluj skill react-hook-form-writer w swoim projekcie Claude/Codex/Copilot, wskazując repozytorium dust-tt.

  2. Przygotuj specyfikację formularza: określ pola, ich typy danych i reguły walidacji (np. wymagane pola, format email, zakresy liczb).

  3. Poproś skill o napisanie nowego komponentu formularza lub refaktoryzację istniejącego. Skill automatycznie utworzy schemat Zod z odpowiednimi walidatorami i zinteguje go przez zodResolver.

  4. Dla pól niestandardowych użyj hook useController zamiast komponentu Controller — zapewnia to lepszą composability i elastyczność w budowaniu własnych komponentów pól.

  5. Jeśli formularze zawierają złożone wzorce (pola zagnieżdżone, dynamiczne tablice pól, wieloetapowe kroki), opisz strukturę, a skill wygeneruje kod następujący najlepsze praktyki projektu.

  6. Zweryfikuj wygenerowany kod: sprawdź, czy walidacja Zod pokrywa wszystkie wymagania, a komponenty pól prawidłowo obsługują błędy i wartości domyślne.

Related skills

tailwind-design-system

by wshobson

Build scalable design systems with Tailwind CSS, design tokens, component libraries, and responsive patterns. Use when creating component libraries, implementing design systems, or standardizing UI patterns.

Frontend
2676

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

shadcn-ui-setup

by maneeshanif

Install and configure Shadcn/ui component library with Radix UI primitives, Aceternity UI effects, set up components, and manage the component registry. Use when adding Shadcn/ui to a Next.js project or installing specific UI components for Phase 2.

Frontend
23167

domain-name-brainstormer

by ComposioHQ

Generates creative domain name ideas for your project and checks availability across multiple TLDs (.com, .io, .dev, .ai, etc.). Saves hours of brainstorming and manual checking.

Frontend
21116

landing-page-guide-v2

by bear2u

Create distinctive, high-converting landing pages that combine proven conversion elements with exceptional design quality. Build beautiful, memorable landing pages using Next.js 14+ and ShadCN UI that avoid generic AI aesthetics while following the 11 essential elements

Frontend
3486

frontend-slides

by sickn33

Create stunning, animation-rich HTML presentations from scratch or by converting PowerPoint files. Use when the user wants to build a presentation, convert a PPT/PPTX to web, or create slides for a talk/pitch. Helps non-designers discover their aesthetic through visual

Frontend
65135