Development Guidelines

1. General Best Practices
   • Always follow official React Native and TypeScript guidelines.
   • Use functional components and React Hooks wherever possible.
   • Maintain consistent code formatting (e.g., using Prettier, ESLint).
2. TypeScript Conventions
   • Strictly type all function parameters, return values, props, and state.
   • Use

     interface

     or

     type

     aliases for component props and complex data structures.
   • Avoid using the

     any

     type unless absolutely necessary.
3. File & Folder Structure
   • Keep files short and focused (e.g., separate large components into multiple smaller files).
   • Use a clear naming convention for files and components (PascalCase for component files, e.g.,

     UserProfile.tsx

     ).
4. Reusability & Composition
   • Prefer composition over repetition. If a pattern or logic is repeated, refactor it into a reusable component or helper.
   • Keep components small and focused on a single responsibility.
5. Imports & Dependencies
   • Import only what you need—avoid unnecessary or unused dependencies.
   • Remove unused imports and variables before committing.
6. Styling
   • Use React Native’s

     StyleSheet

     or other appropriate styling approaches to keep styles organized.
   • Avoid excessive inline styles.
7. Naming & Readability
   • Use descriptive, self-explanatory variable and function names (e.g.,

     fetchUserData

     , not

     getData

     ).
   • Avoid generic placeholder names like

     foo

     or

     bar

     .
8. Functions & Handlers
   • Use arrow functions for internal component utilities, e.g.: (const handleClick = () => {}).
   • Keep each helper function small and focused on a single task.
9. Commenting & Documentation
   • Add a brief comment block at the top of each page or component describing its purpose (optional but recommended).
   • Use inline comments for complex logic to help future maintainers.
   • For every exported function or component, include a concise JSDoc block at the top describing its purpose, expected input parameters, and return values. Keep explanations clear and to the point, so future readers can quickly understand how and why to use the function or component.
10. Performance Considerations
    • Use

      React.memo

      or

      useCallback

      /

      useMemo

      where appropriate to optimize performance.
    • Ensure that the app will work smoothly on both Android and iOS simulators (or devices).
11. Testing & Validation
    • Write unit tests for critical logic, custom hooks, and reusable components.
    • Validate data and handle error states gracefully.