typescript

Enforce TypeScript and React/TSX coding conventions for type-safe frontend codebases.

Updated May 15, 2021

Search Tags:#typescript #react #patterns #type-safety #coding-conventions #tsx

Ready to run

npx skills add https://github.com/JustinFirsching/dotfiles --skill typescript-justinfirsching

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: typescript
Source: https://github.com/JustinFirsching/dotfiles/tree/main/opencode/.config/opencode/skill/typescript
Command: npx skills add https://github.com/JustinFirsching/dotfiles --skill typescript-justinfirsching

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

TypeScript and React/TSX coding conventions and patterns are essential for maintaining scalable, type-safe codebases; this skill provides a comprehensive guide.

Core Features & Use Cases

No Any Type: ensure strong typing and safety.
Named Exports Only: enforce explicit imports for maintainability.
Functional Components with Hooks: promote modern React patterns.
Type Patterns: interface vs type, props typing, generics.
Error Handling & Validation: robust patterns and best practices.

Quick Start

Adopt these TypeScript conventions in your TS/TSX projects to standardize coding patterns and improve type safety.

Frequently Asked Questions about typescript

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

FAQPage Schema

What are the best TypeScript conventions for preventing the any type in React components?▼

Enforcing strict TypeScript conventions eliminates the any type, ensuring robust typing for React components and preventing runtime errors in your TSX codebase.

How do I standardize interface vs type usage and props typing across a TSX project?▼

Standardizing interface vs type usage and props typing across a TSX project involves applying functional component patterns with explicit named exports to improve maintainability and type safety.

Does this TypeScript skill enforce named exports and strict configuration for frontend codebases?▼

Yes, the TypeScript skill enforces named exports only and strict TypeScript configuration for frontend codebases to promote modern React patterns and improve overall maintainability.

What are the recommended TypeScript patterns for error handling and data fetching structures?▼

Recommended TypeScript patterns for error handling and data fetching structures provide robust validation mechanisms, ensuring type-safe data flow and reliable error management across your components.

When should I apply generics across components in a TypeScript and React codebase?▼

Apply generics across components in a TypeScript and React codebase when you need reusable, type-safe logic for hooks and props, ensuring flexible yet strictly typed data structures.