react-typescript-conventions

What problem does it solve?

Inconsistent React component design, lack of TypeScript type safety, and disorganized folder structures can lead to unmaintainable frontend code. This skill provides strict conventions for React with TypeScript.

Core Features & Use Cases

• Functional Components: Guides on using functional components with FC<Props> type.
• TypeScript Strict Mode: Recommends enabling strict mode in tsconfig.json for enhanced type safety.
• Folder Structure: Defines a standard layout for components/, hooks/, utils/, and pages/.
• Hooks & State Management: Covers useState, useEffect, useContext for state, and custom hooks for logic extraction.
• Use Case: When starting a new React project, use this skill to quickly set up a robust folder structure, define prop interfaces, and implement state management using hooks, ensuring type safety and maintainability from the start.

Quick Start

Use the react-typescript-conventions skill to generate the basic structure for a new React functional component with TypeScript props.