tanstack-form-architecture

What problem does it solve?

This Skill provides a robust, scalable, and reusable architecture for building forms in React applications, ensuring consistency and maintainability.

Core Features & Use Cases

• 4-Layer Architecture: Enforces separation of concerns (Schema, Hook, Form, Container) for cleaner code.
• Reusability: Forms can be easily reused across different UI contexts like dialogs, cards, and drawers.
• TanStack Form & Zod Integration: Leverages powerful libraries for state management and validation.
• Use Case: When creating a new user profile form, use this Skill to scaffold the schema, form hook, UI components, and integrate it into a dialog for creation or a card for editing, ensuring all forms follow the same best practices.

Quick Start

Use the tanstack-form-architecture skill to create a new user profile form.