skills.rest
raulnq
raulnqCOMMUNITY
Explore all skills by this author →
GitHub

add_frontend_feature

Generate React 19 frontend feature files with routing and data fetching.

Updated Feb 8, 2026
Search Tags:#feature development#frontend#react#code generation#scaffolding#ui components
One-click install
npx skills add https://github.com/raulnq/node-hono-react-monorepo --skill add-frontend-feature-raulnq
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: add_frontend_feature
Source: https://github.com/raulnq/node-hono-react-monorepo/tree/main/.claude/skills/add-frontend-feature
Command: npx skills add https://github.com/raulnq/node-hono-react-monorepo --skill add-frontend-feature-raulnq

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill streamlines the creation of new frontend features in a React application, ensuring consistency and adherence to established patterns.

Core Features & Use Cases

  • Feature Scaffolding: Automatically generates the necessary files and directory structure for a new feature, including pages, components, and stores.
  • Pattern Enforcement: Follows predefined templates and best practices for API client integration, React Query hooks, form handling, and routing.
  • Use Case: When adding a new "Projects" section to the application, this Skill will create all the boilerplate code for listing, viewing, adding, and editing projects, integrating seamlessly with the existing UI and data fetching layers.

Quick Start

Use the add_frontend_feature skill to create a new feature for managing 'tasks'.

Frequently Asked Questions about add_frontend_feature

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

FAQPage Schema
How do I scaffold a new React feature with pages, components, and API hooks?▼

The skill generates feature directories, API client functions, React Query hooks, form components, page components, route registration, and sidebar/header entries based on provided templates.

What tech stack does this React feature scaffolding tool support?▼

This skill generates frontend pages and components for a React 19 application using Hono client, React Router, TanStack React Query, and shadcn/ui.

Does this tool generate routing and navigation entries for new UI components?▼

Yes, the skill automatically handles route registration and adds sidebar and header entries when scaffolding a new feature.

Can I use this to generate boilerplate code for CRUD operations in React?▼

Yes, the skill creates all the boilerplate code for listing, viewing, adding, and editing features, integrating with existing UI and data fetching layers.

How do I ensure consistency when adding new frontend pages to my application?▼

This skill ensures consistency by following predefined templates and best practices for API client integration, React Query hooks, form handling, and routing.

Related Skills

Explore More Software Engineering Skills→
damandeep611damandeep611

agentic-jumpstart-react

Provide React 19 patterns for TanStack Start apps with shadcn/ui and TanStack Query.

Community
Advanced
spuneiarturspuneiartur
1

api-hook-wiring

Wire frontend components to backend APIs using Axios and React Query hooks.

Community
Advanced
AppleLampsAppleLamps
1

shadcn-component

Generate shadcn/ui components with Tailwind styling via npx.

Community
Intermediate
ggombeeggombee
13

react-spa

Create React Single Page Applications with Vite or Create React App.

Community
Intermediate