new-feature

Generates a complete React feature directory with TDD workflow and predefined components, hooks, and tests.

2|1|Updated Jan 30, 2026
One-click install
npx skills add https://github.com/solrac97gr/marketplace-plugins --skill new-feature-solrac97gr
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: new-feature
Source: https://github.com/solrac97gr/marketplace-plugins/tree/main/plugins/react-dev/skills/new-feature
Command: npx skills add https://github.com/solrac97gr/marketplace-plugins --skill new-feature-solrac97gr

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill automates the creation of new React features, ensuring they are built with a Test-Driven Development (TDD) workflow, adhering to best practices and architectural patterns.

Core Features & Use Cases

  • Automated Feature Scaffolding: Generates a complete directory structure for a new React feature, including components, hooks, services, types, and tests.
  • TDD Workflow Enforcement: Guides the developer through the Types First (BLUE), Tests First (RED), and Implementation (GREEN) phases.
  • Use Case: When starting a new user profile management feature, use this Skill to generate all necessary files and tests, ensuring a robust and maintainable codebase from the start.

Quick Start

Use the new-feature skill to scaffold a React feature named 'user-profile' with a description 'Manage user profile information'.

Frequently Asked Questions about new-feature

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

FAQPage Schema
How do I scaffold a React feature using Test-Driven Development?

To scaffold a React feature using TDD, generate a structured directory with components, hooks, services, types, and tests. This enforces a feature-based architecture and guides you through Types First, Tests First, and Implementation phases.

What is the TDD workflow for generating React components and hooks?

The TDD workflow for generating React components follows three phases: Types First (BLUE) to define interfaces, Tests First (RED) to establish expectations, and Implementation (GREEN) to write the functional code that passes those tests.

Can I use this scaffolding tool to enforce feature-based architecture in TypeScript?

Yes, you can use this scaffolding tool to enforce feature-based architecture in TypeScript. It generates a complete directory structure for new React features, ensuring strict adherence to code standards and architectural patterns.

What's the best way to start a new React feature with tests and services included?

The best way to start a new React feature with tests and services is to use an automated scaffolding tool that generates all necessary files simultaneously. This ensures a robust, maintainable codebase from the start by including hooks, types, and tests.

Does React feature scaffolding work without configuring dependencies first?

Yes, React feature scaffolding works without configuring external dependencies. The Skill operates independently to generate your feature-based directory structure, requiring only your provided feature name and description to begin.

Why should I use a TDD scaffolding approach instead of manually creating React feature files?

You should use a TDD scaffolding approach instead of manually creating files to ensure architectural consistency. Automating the generation of components, hooks, and tests enforces strict code standards and prevents structural drift across your codebase.