[FEATURE]: scaffolding React application

[helabenkhalfallah]

-> ESLint + recommended config + complexity config
-> Prettier + recommended config
-> TypeScript + recommended config
-> Monorepo: PNPM + Vite (or Turbo, or Nx)
-> Bundler: Vite
-> Unit tests: Vitest or Jest (two options available)
-> React: latest version
-> Architecture: HOFA (Hierarchy of Folders Architecture)
-> ZOD (schema validation)
-> CSS: choice between SCSS, Tailwind CSS, or CSS-in-JS

-> State Management & Query Management:

• Yes, allow choice between Axios and Fetch
• Yes, use TanStack Query by default via custom hook + service (Fetch or Axios)
• For state management, allow complete choice; no default state manager / Options: Zustand, TanStack Query, RTK (Redux Toolkit)

-> SSR (Server-Side Rendering): requires further investigation

-> Naming Conventions:

• Import Order: consider the plugin https://github.com/trivago/prettier-plugin-sort-imports to avoid merge request conflicts. Suggest using import type {Interface} from './types.ts' for TypeScript types whenever possible.

• For React, remove PropTypes in favor of TypeScript.

• The rest of the recommendations are acceptable.

• https://github.com/helabenkhalfallah/trendy-toys-web-site/wiki/Internal-Manifesto-for-Clean-Code#react

• https://github.com/helabenkhalfallah/trendy-toys-web-site/wiki/Internal-Manifesto-for-Clean-Code#naming-conventions

• https://github.com/helabenkhalfallah/trendy-toys-web-site/wiki/Internal-Manifesto-for-Clean-Code#specific-naming-conventions

• https://github.com/helabenkhalfallah/trendy-toys-web-site/wiki/Internal-Manifesto-for-Clean-Code#import-order

• https://github.com/ream88/stylelint-config-idiomatic-order