development-react-components

Official

Build robust React components

Authorcoinbase
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This Skill provides a comprehensive guide and set of conventions for developing high-quality, reusable React components within the Coinbase Design System (CDS).

Core Features & Use Cases

  • Component Development Workflow: Outlines a step-by-step process from research to implementation and testing.
  • Organizational Standards: Defines clear file structures and component categorization.
  • Coding Conventions: Enforces best practices like memoization, ref handling, prop documentation, and design token usage.
  • Design Token System: Details the available design tokens for colors, spacing, typography, etc.
  • Component Patterns: Explains advanced patterns like Compound Components, Context + Hook, and Controlled/Uncontrolled patterns.
  • Use Case: A new developer joining the CDS team can use this Skill to quickly understand and adhere to all established guidelines for creating new React components.

Quick Start

Follow the established conventions for developing a new React component.

Dependency Matrix

Required Modules

None required

Components

references

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: development-react-components
Download link: https://github.com/coinbase/cds/archive/main.zip#development-react-components

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.