React & TypeScript Rules

Organizing TypeScript types in a React component library involves type-first development with structured type organization, preferring 'type' over 'interface' to ensure consistent, error-resistant frontend code across your project.

To enforce direct React imports and reduce bundle size, apply coding standards that eliminate the React namespace, improving clarity and consistency across your React with TypeScript components.

Use useReducer versus useState for state management in React based on complexity: useState handles local state, while useReducer manages reducers, with Context or Zustand for simple global state patterns.

Yes, these React TypeScript coding standards apply to both apps and component libraries that use React with TypeScript, enforcing import patterns, type discipline, and common state management patterns.

Preferring 'type' over 'interface' for TypeScript component design promotes type-first development and structured type organization, ensuring consistent, error-resistant frontend code across your project.

To refactor a React component to use direct imports and typed props, apply these coding standards to update import conventions and utilize a dedicated type file for structured type organization.