frontend-form-views

Build CRUD form views with shared dataForm controllers and route-param injection.

Updated Sep 16, 2025
One-click install
npx skills add https://github.com/slingr-stack/qa-test-drumr --skill frontend-form-views
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: frontend-form-views
Source: https://github.com/slingr-stack/qa-test-drumr/tree/main/project-management-app/.agents/skills/frontend-form-views
Command: npx skills add https://github.com/slingr-stack/qa-test-drumr --skill frontend-form-views

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill removes the repetition and routing complexity involved in building frontend CRUD form pages, helping you assemble reliable create, edit, and read experiences with consistent behavior.

Core Features & Use Cases

  • Shared form pipeline: Reuses one data form controller across CreateView, EditView, ReadView, and action parameter forms.
  • Custom layouts and field control: Supports selected fields, local field overrides, custom bodies, and low-level dataFormProps tuning.
  • Refresh and save behavior: Handles refresh triggers, custom refresh callbacks, before-save checks, save success handling, and error handling.
  • Read-only composition: Supports nested related views inside ReadView for scoped tables or custom panels.
  • Use case: Build a task form that uses a custom body for editing, a nested related list in the read view, and route wrappers that receive the record id automatically.

Quick Start

Ask for a Drumr frontend form-view implementation that creates CreateView, EditView, and ReadView wrappers with shared data form context, refresh handling, and route-based id injection.

Frequently Asked Questions about frontend-form-views

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I build CRUD form views for the Drumr Framework without repeating boilerplate?

CRUD form views for the Drumr Framework can be assembled by coordinating CreateView, EditView, ReadView, and ActionView wrappers through a shared data form controller, reducing boilerplate and ensuring consistent behavior across all model-based workflows.

What is a shared data form controller and how does it work for frontend forms?

A shared data form controller provides one reusable pipeline that handles field selection, overrides, refresh triggers, save hooks, and error handling across create, edit, read, and action parameter forms without duplicating controller logic.

Does the Drumr Framework support nested read-only sections inside a ReadView?

The Drumr Framework supports nested related views inside ReadView, allowing scoped tables or custom panels to be composed within a read-only section for richer record presentation.

How do I inject route parameters into frontend form views without manual router plumbing?

Route parameters such as a record id are injected automatically through routed view wrappers that receive the param without manual router plumbing, streamlining model-based workflows.

What's the best way to handle refresh callbacks and save hooks in frontend CRUD forms?

The best way to handle refresh callbacks and save hooks is through the shared data form controller, which supports custom refresh triggers, before-save checks, save success handling, and error handling in one place.

Can I override specific fields and use a custom body in an EditView?

EditView supports selected fields, local field overrides, custom form bodies, and low-level dataFormProps tuning, giving full control over layout and behavior while reusing the shared form pipeline.