React Component Architecture
aj-geddes/useful-ai-prompts/skills/react-component-architectureby aj-geddes3f5182cfd739No license355 starsListed Oct 8, 2026Updated Oct 8, 2026Repository updated 7 months ago
Design scalable React components using functional components, hooks, composition patterns, and TypeScript. Use when building reusable component libraries and maintainable UI systems.
Only the file list is public. File contents are available once the skill is installed in a workspace.
| Path | Size | Type |
|---|---|---|
| references/composition-pattern.md | 891 B | text/markdown |
| references/custom-hooks-pattern.md | 1.3 KB | text/markdown |
| references/functional-component-with-hooks.md | 981 B | text/markdown |
| references/higher-order-component-hoc.md | 719 B | text/markdown |
| references/render-props-pattern.md | 882 B | text/markdown |
| SKILL.md | 2.3 KB | text/markdown |
| templates/component-template.tsx | 318 B | text/plain |
Source and attribution
Source:aj-geddes/useful-ai-promptsinskills/react-component-architectureat commit3f5182c
License: No license
Content belongs to its original authors. SourceWeft indexes it from a public repository.
More from aj-geddes/useful-ai-prompts
Xss Prevention
aj-geddes
Prevent Cross-Site Scripting (XSS) attacks through input sanitization, output encoding, and Content Security Policy. Use when handling user-generated content in web applications.
Wireframe Prototyping
aj-geddes
Create wireframes and interactive prototypes to visualize user interfaces and gather feedback early. Use tools and techniques to communicate design ideas before development.
Web Performance Optimization
aj-geddes
Guides web performance optimization through code splitting, lazy loading, caching, compression, and monitoring.
Vue Application Structure
aj-geddes
Guides structuring Vue 3 applications with the Composition API, component organization, and TypeScript.
Visual Regression Testing
aj-geddes
Guides visual regression testing of UI by comparing screenshots across versions to catch unintended visual changes.
User Persona Creation
aj-geddes
Creates research-based user personas to guide product design, prioritization and messaging.
More in Software Development
Playground
anthropics
Builds self-contained interactive HTML playgrounds with controls, live preview, and copyable prompt output.
M5 Onboard
anthropics
Provisions M5Stack ESP32 boards by detecting them on USB, flashing UIFlow 2.0 firmware, and installing a MicroPython app bundle.
Cardputer Buddy
anthropics
Guides iterating on a Cardputer-Adv MicroPython app bundle: adding apps, pushing files over USB-serial, tailing logs, and running REPL commands.
Web Design Guidelines
vercel-labs
Reviews UI code against Web Interface Guidelines fetched from a remote source and reports findings as file:line entries.
Vercel React Native Skills
vercel-labs
React Native and Expo best-practice rules covering list performance, animation, navigation, UI patterns, state, and monorepo setup.
Vercel React Best Practices
vercel-labs
Vercel's React and Next.js performance guidelines, organized as 70 rules for writing, reviewing, and refactoring code.