Here's how I structure my React projects to scale for even large projects without the need to use frameworks like NextJs or something else. Just plain #ReactJs and my #API communicating. The /src dir is the key and I'm using Ts and Ant Design for my projects.

🛠️ The models dir contains all the model types from my backend and proper types within the application. All models are grouped by modules (again, reflecting the modules in the backend)
🛠️ The Layout dir is to take care of layout components for properly scoping my styles depending on the area (admin or guest users).
🛠️ The context is where I define all my context for things like table wrappers, global modals for my forms and other search or export functionality for my table data.
🛠️ The services dir holds all the links endpoints that are called from the hook only. So no component should ever call the service directly. The hooks should call the services for the proper endpoints through an interceptor that transforms the data to match the model and should update the state. All this state data can also only be accessed from the hooks, and never directly by calling a #Redux selector of any sort.
🛠️ The #redux directory, as you may be able to guess right, is to set up all the state management for every model.
🛠️ The Hooks directory is where all the state is being pulled from, and every logic is handled. You should call hooks only for data and handle effects at the level of components or pages (which are still components, though).

I hope that, this can give you a clue on how you should or can set up and configure your app in a way that should and can scale. Let me know your thoughts if you're doing something different.

What are your thoughts?