react-02-implement

Plan and implement React features using the Feature Library pattern in an Nx monorepo.

Updated Aug 27, 2026

Search Tags:#react #monorepo #nx #implement #frontend-pattern #feature-library

Ready to run

npx skills add https://github.com/tak-bro/claude-code --skill react-02-implement

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: react-02-implement
Source: https://github.com/tak-bro/claude-code/tree/main/skills/react-02-implement
Command: npx skills add https://github.com/tak-bro/claude-code --skill react-02-implement

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This pattern guides and standardizes React feature development within a scalable Nx monorepo, reducing duplication and confusion when building library-based features.

Core Features & Use Cases

Provides a blueprint for organizing React features into libs/{feature} with APIs, hooks, and types
Enforces barrel exports and a clear flow: Component → Hook → TanStack Query → API
Facilitates consistent, scalable front-end modules across teams using the Feature Library pattern

Quick Start

Plan and implement a new React feature using the Feature Library pattern in the Nx monorepo.

Frequently Asked Questions about react-02-implement

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

FAQPage Schema

How do I structure React features in an Nx monorepo to avoid code duplication?▼

Structure React features in an Nx monorepo using the Feature Library pattern, organizing code into libs/{feature} with dedicated APIs, hooks, and types. This enforces barrel exports and a clear Component → Hook → TanStack Query → API flow to reduce duplication.

What is the Feature Library pattern for React development?▼

The Feature Library pattern organizes React features into self-contained library modules within an Nx monorepo. It standardizes development by enforcing barrel exports and a unidirectional data flow from Component → Hook → TanStack Query → API.

How do I implement a new React feature library with Nx?▼

Implement a new React feature library by planning the feature scope within libs/{feature}, defining shared hooks and types, and adhering to the SKILL.md structure. This process references _shared templates to enforce consistent coding standards across the module.

Does this React feature library pattern work with TanStack Query?▼

Yes, the React feature library pattern explicitly integrates with TanStack Query. It enforces a standardized data flow where Components call Hooks, which then utilize TanStack Query to interact with the API layer, ensuring consistent data fetching.

When should I use barrel exports in my Nx React monorepo?▼

Use barrel exports in an Nx React monorepo when implementing the Feature Library pattern to standardize module APIs. They provide a clear, public interface for each feature library, reducing confusion and preventing duplicate exports across teams.

What's the best way to standardize frontend modules across teams using Nx?▼

The best way to standardize frontend modules across teams using Nx is adopting the Feature Library pattern. It provides a strict blueprint for organizing features into libs with barrel exports and a standardized Hook → TanStack Query → API flow.