scaffold-feature

Scaffold React components, TanStack Query hooks, MSW handlers, and Vitest tests.

1|Updated Feb 25, 2026
One-click install
npx skills add https://github.com/piers-sinclair/Dostar --skill scaffold-feature-piers-sinclair
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: scaffold-feature
Source: https://github.com/piers-sinclair/Dostar/tree/main/.claude/skills/scaffold-feature
Command: npx skills add https://github.com/piers-sinclair/Dostar --skill scaffold-feature-piers-sinclair

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill eliminates the repetitive boilerplate required to build new frontend features, ensuring consistency across hooks, components, MSW handlers, and tests.

Core Features & Use Cases

  • Automated Scaffolding: Generates feature folders, API hooks, MSW handlers, and test suites from a simple description.
  • Type-Safe Integration: Automatically leverages generated Orval API clients to ensure frontend types match backend DTOs.
  • Use Case: When adding a new entity like Products to your application, use this skill to instantly generate the CRUD UI, API integration, and test coverage in one workflow.

Quick Start

Use the scaffold-feature skill to generate the frontend code for a new feature described as Products with name, SKU, and price fields.

Frequently Asked Questions about scaffold-feature

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

FAQPage Schema
How do I scaffold React feature modules with boilerplate code automatically?

To scaffold React feature modules, provide a simple feature description like "Products". The tool instantly generates the complete folder structure, React components, API integration, and test suites, eliminating repetitive manual boilerplate creation.

How does MSW handler generation work when adding new frontend features?

MSW handler generation works by creating mock service worker endpoints alongside your React components. When you scaffold a new frontend feature, the tool automatically generates matching MSW handlers to ensure your testing environment accurately mocks backend API interactions.

Do I need generated API clients before scaffolding React features?

Yes, you need generated API clients before scaffolding React features. The tool requires existing backend modules and generated Orval API clients to ensure strict type safety and functional parity between your frontend types and backend DTOs.

Can I use this scaffolding tool within a .NET modular monolith and React Vite architecture?

Yes, you can use this scaffolding tool within a .NET modular monolith and React Vite architecture. It is specifically designed to operate within this stack, maintaining strict naming and architectural conventions across all generated files.

What is the best way to generate CRUD UI and Vitest test suites for a new entity?

The best way to generate CRUD UI and Vitest test suites for a new entity is to describe the entity and its fields, such as "Products with name, SKU, and price". The tool instantly outputs the complete UI, API integration, and test coverage in one workflow.

How do TanStack Query hooks integrate with generated React components?

TanStack Query hooks integrate by being automatically generated within the feature module. The scaffolding process creates these data-fetching hooks alongside your React components, directly leveraging the generated API clients to maintain type-safe data fetching.