react-conventions

The 'react-conventions' skill provides a comprehensive set of best practices for coding in React and React Native with TypeScript. It helps developers maintain consistency, readability, and performance in their code by enforcing clear guidelines for naming conventions, component structure, typing patterns, and accessibility considerations. This skill ensures that developers follow standardized approaches to writing components, hooks, and props, which leads to more maintainable and scalable codebases. It is especially useful for teams working on large-scale projects where consistency is crucial for collaboration and efficient code review processes.

Key features of the 'react-conventions' skill include rules for naming conventions (e.g., using PascalCase for components, camelCase for hooks), proper typing with TypeScript (e.g., using FC<Props> for functional components), and suggestions for component structure (e.g., order of imports, types, hooks, and render logic). The skill also covers best practices for optimizing accessibility and performance, with guidelines for JSX readability, using default values in destructuring, and making props readonly by default. Additionally, it emphasizes testability by promoting clear separation of concerns within components.

The target users for this skill are React and React Native developers working with TypeScript, especially those who are creating reusable components, writing custom hooks, or reviewing code within teams. It is ideal for developers who want to adhere to industry best practices for code quality and maintainability, and it is particularly useful in team environments where standardized conventions are necessary for smooth collaboration and consistent code reviews.