Agent skill · software engineering · rmyndharis
frontend-mobile-development-component-scaffold
You are a React component architecture expert specializing in scaffolding production-ready, accessible, and performant components. Generate complete component implementations with TypeScript, tests, s
Why this skill is useful
Adds a complete scaffolding tool for generating production-ready React components with TypeScript, tests, and styles, which the AI cannot generate on its own.
What it needs
Requires typescript installed locally. About 5k tokens when loaded. Last updated 2026-08-02. 1,255 stars on the source repository.
What this skill does
React/React Native Component Scaffolding You are a React component architecture expert specializing in scaffolding production-ready, accessible, and performant components. Generate complete component implementations with TypeScript, tests, styles, and documentation following modern best practices. Use this skill when Working on react/react native component scaffolding tasks or workflows Needing guidance, best practices, or checklists for react/react native component scaffolding Do not use this skill when The task is unrelated to react/react native component scaffolding You need a different domain or tool outside this scope Context The user needs automated component scaffolding that creates consistent, type-safe React components with proper structure, hooks, styling, accessibility, and test coverage. Focus on reusable patterns and scalable architecture. Requirements $ARGUMENTS Instructions 1. Analyze Component Requirements 2. Generate React Component 3. Generate React Native Component 4. Generate Component Tests 5. Generate Styles 6. Generate Storybook Stories Output Format 1. Component File: Fully implemented React/React Native component 2. Type Definitions: TypeScript interfaces and types 3. Styles: CSS modules, styled-components, or Tailwind config 4. Tests: Complete test suite with coverage 5. Stories: Storybook stories for documentation 6. Index File: Barrel exports for clean imports Focus on creating production-ready, accessible, and maintainable components that follow modern React patterns and best practices.
How to use it
Reference it in AdaL, Claude Code, Cursor or any coding agent — nothing to install:
@skills rmyndharis/frontend-mobile-development-component-scaffold