skills.rest
GMNAPI
GMNAPICOMMUNITY
Explore all skills by this author →
GitHub

component-generator

Generates React components with TypeScript, i18n, animations, and test scaffolds.

Updated Nov 9, 2025
Search Tags:#typescript#testing#react#scaffolding#component#i18n#motion
Ready to run
npx skills add https://github.com/GMNAPI/DevPortfolio --skill component-generator-gmnapi
💬 Prompt for ChatGPT / Claude Chat▼
Please help me install this Agent Skill.
Skill: component-generator
Source: https://github.com/GMNAPI/DevPortfolio/tree/main/.claude/skills/component-generator
Command: npx skills add https://github.com/GMNAPI/DevPortfolio --skill component-generator-gmnapi

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill generates production-ready React components for the Portfolio app, following DevPortfolio Clean Architecture, with proper TypeScript typing, i18n translations, Framer Motion animations, dark mode support, and test scaffolds.

Core Features & Use Cases

  • Feature Components: Main sections (Hero, About, Skills, Projects, Contact) with interactivity and translations.
  • UI Components: Reusable atomic components (Button, Card, Input) with accessibility and variants.
  • Tests: Generates test scaffolds and translation keys.

Quick Start

  • Generate a Button component for the Blog feature and wire it into the UI. Then add translation keys to messages/es.json and messages/en.json, and scaffold a test file.