typescript-rules

Enforce React and TypeScript frontend development rules for type safety and component design.

1|Updated Jan 26, 2026

Search Tags:#code quality #type safety #typescript #best practices #frontend #react #component design

Ready to run

npx skills add https://github.com/simoabid/ABID.Dev-Portfolio --skill typescript-rules-simoabid

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: typescript-rules
Source: https://github.com/simoabid/ABID.Dev-Portfolio/tree/main/.agent/skills/typescript-rules
Command: npx skills add https://github.com/simoabid/ABID.Dev-Portfolio --skill typescript-rules-simoabid

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill provides a comprehensive set of rules and best practices for developing React and TypeScript frontend applications, ensuring code quality, maintainability, and robustness.

Core Features & Use Cases

Type Safety: Enforces strict type checking, preventing runtime errors.
Component Design: Guides the creation of well-structured and reusable React components.
State Management: Recommends efficient patterns for managing application state.
Error Handling: Mandates robust error handling strategies.
Use Case: When implementing a new feature in a React/TypeScript project, consult these rules to ensure adherence to established standards for type safety, component structure, and error handling.

Quick Start

Apply the typescript-rules skill to ensure all React component props are strictly typed.

Frequently Asked Questions about typescript-rules

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I enforce strict type safety and best practices in React and TypeScript components?▼

To enforce strict type safety in React and TypeScript, apply established rules for component design, state management, and error handling. This ensures strict type checking, runtime error prevention, and clean code principles across frontend features.

What's the best way to structure React component props using modern TypeScript features?▼

The best way to structure React component props is by adhering to specific design patterns that leverage modern TypeScript features. This approach mandates strict typing for props and utilizes type guards to ensure robust, reusable component structures.

How do I handle asynchronous processing and error handling in a TypeScript and React frontend?▼

Handle asynchronous processing in a React frontend by following mandated robust error handling strategies and TypeScript patterns. These rules guide the implementation of async features while maintaining strict type safety and preventing runtime errors.

Does aggressive refactoring work with existing React and TypeScript codebases to improve code quality?▼

Aggressive refactoring works with existing React and TypeScript codebases to improve code quality. It enforces modern type features, type guards, and clean code principles, ensuring maintainability and robustness when implementing new frontend features.