Generate full-stack create/edit forms with backend endpoints, Zod schemas, and UI layouts.
npx skills add https://github.com/tonehq/tone --skill form-page
Please help me install this Agent Skill. Skill: form_page Source: https://github.com/tonehq/tone/tree/main/.claude/skills/form_page Command: npx skills add https://github.com/tonehq/tone --skill form-page
Create a complete create/edit form — both backend API endpoint and frontend UI — for any entity in the Tone platform. Orchestrates the backend_form and frontend_forms skills. User specifies layout mode (modal, drawer, or page) or it auto-detects from field count. Generates the backend create/update endpoints, Zod schema, API mutation hooks, and the form UI.
Run the form_page skill to generate and wire a complete create/edit form for a new entity, including backend and frontend components.
High-intent search queries and answers about installing and using this skill.
Full-stack form generation automates the creation of backend API endpoints, Zod data validation schemas, API mutation hooks, and frontend UI forms. It orchestrates these layers to produce a cohesive create and edit form experience for any specified entity.
Scaffolding a Zod schema and API hooks involves generating backend create and update endpoints alongside frontend form components. This skill automates the wiring between data validation and API mutation hooks to ensure end-to-end type safety and functionality.
Yes, you can automatically select a modal, drawer, or page layout for your form. The generation process auto-detects the appropriate layout mode based on the entity's field count, or you can explicitly specify the layout during scaffolding.
The best way to wire a new frontend form to a parent page is through multi-phase scaffolding. This process generates the form UI and automatically connects it to the parent page layout, ensuring proper integration with the existing application structure.
Yes, this form generator supports both backend and frontend code generation. It produces backend create and update endpoints alongside frontend UI forms, coordinating the full-stack layers to deliver a cohesive data validation and submission experience.
You should manually specify a form layout instead of auto-detecting when your entity has a specific UI requirement that overrides field count heuristics. Explicitly choosing modal, drawer, or page ensures the generated form matches your exact design constraints.
musujDefine project terminology, entities, relationships, and data structures.
elbrunoAutomate browser interactions and execute web page tests with Playwright.
moorej2400Orchestrate multi-agent tasks with parent-led coordination and MCP worktree management.
vishalsachdevValidate forms and API data with Zod schemas and inferred TypeScript types.
