project-structure

To organize React project files effectively, map components, pages, hooks, contexts, utilities, and types under dedicated src/ directories. This structure prevents wasted time by showing exactly where each type of code lives.

Adding a new React hook requires placing it in the designated hooks directory under src/ and importing it using the @/ alias configured in tsconfig paths. This maintains consistent file placement and import conventions.

React routing flows from index.html into main.tsx, then App.tsx, and finally AppRouter.tsx. This entry-point sequence traces execution to show how the application boots and initializes routes.

Tests and configuration files belong in their dedicated directories alongside the src/ structure. Following these file placement rules ensures contribution guidance aligns with existing conventions for build, public, docs, and script locations.

Yes, the project structure convention supports contributor workflow by leveraging tsconfig paths for consistent @/ alias imports. This ensures file placement rules and naming conventions align across components, pages, and hooks.