frontend-dev-guidelines

To structure a scalable React app and prevent pattern drift, enforce standardized file organization using features/ and components/ directories alongside modern component patterns like React.FC and lazy loading.

The best way to handle data fetching with Suspense in React is by using useSuspenseQuery combined with Suspense boundaries. This ensures robust type-safety and optimizes performance across feature development.

Yes, this frontend development guide supports TanStack Router for routing and MUI v7 for styling. It provides specific guidance to ensure type-safety and consistent patterns across these tools.

To configure lazy loading and type-safety for new React features, apply TypeScript best practices and prescribed structure conventions. This enforces alias usage and robust form handling across components.

You should not use React.FC and lazy loading patterns when building simple, non-scalable applications where strict structure and alias usage are unnecessary. These patterns target large frontend applications requiring maintainability.