frontend-patterns

Community

Build IdeaForge React components with dark mode and Tailwind.

AuthorHolo00
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This Skill provides a standardized, efficient way to build React components and pages for the IdeaForge frontend, ensuring consistency with brand guidelines, dark mode, and API interaction patterns.

Core Features & Use Cases

  • Component Scaffolding: Quickly create new React components following established patterns and best practices.
  • Dark Mode Integration: Automatically apply dark mode classes and brand colors, ensuring a consistent user experience.
  • API Interaction: Standardized patterns for making backend API calls and handling responses.
  • Use Case: "Create a new IdeaCard component that displays an idea's name, summary, and score, ensuring it adheres to IdeaForge's dark mode styling and uses the correct brand colors and common UI elements."

Quick Start

Use the frontend-patterns skill to create a new React component named UserProfileHeader that displays a user's name and avatar, styled for dark mode.

Dependency Matrix

Required Modules

None required

Components

Standard package

💻 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: frontend-patterns
Download link: https://github.com/Holo00/IdeaForge/archive/main.zip#frontend-patterns

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