Skills
.Work. You
Rest

react_comment-structure

Community

Standardize React code comments

Software Engineering#typescript#react#code style#hooks#comments#component structure
AuthorViewableGravy
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This Skill enforces a consistent and predictable comment structure within React code, improving readability and maintainability for both top-level sections and in-component elements.

Core Features & Use Cases

  • Enforces Top-Level Sections: Ensures TYPE DEFINITIONS, CONSTS, and COMPONENT START (or HOOK START) are correctly ordered and present when applicable.
  • Standardizes Inline Sections: Mandates a specific order for inline comments within components: STATE, HOOKS, QUERIES, EFFECTS, FUNCTIONS, RENDER HELPERS, RENDER.
  • Use Case: When developing a new React component, this skill will automatically prompt you to add the necessary comment headers in the correct order, ensuring that your code is organized from the start.

Quick Start

Apply the react_comment-structure skill to your React component file.

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: react_comment-structure
Download link: https://github.com/ViewableGravy/better-ecs/archive/main.zip#react-comment-structure

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 471,000+ vetted skills library on demand.