Here is what I would like to do, build my project (reactjs front-end and java back-end) that has multiple modules in java based on features. Here is what I am thinking with my folder structure:
<project name>
- auth0
- src
- main
- java
- security
- src
- main
- java
- core
- src
- main
- java
- **ui**
- <feature 1>
- src
- main
- java
- **ui**
- <feature 2>
- src
- main
- java
- **ui**
- <feature n>
- src
- main
- java
- **ui**
So the base reactjs and java backend module is core so that is where the main code will live and when I add a new feature I will add the logic (java) and the ui related code. How would I be able to set this up in maven or gradle so that when I build it can have all the features built into a functional application?
>Solution :
This seems at first glance quite ordered, however with this folder structure you would get problems in the long run.
Also, you don’t follow the common convention, and often if you start to cook up your own structures people who will then later work with your project will get confused. Hence, I would recommend that you are not doing it.
That being said, your react application is after you build it set up in a dist folder which is static! Often a react app is not served from the same place as the backend. This is much better for scalability. For instance, you could serve your static react app from a digital ocean droplet or from a VM, while your backend code is served by AWS or any other VM.
So in the end your code is separated anyway!
If you still wish to proceed with your idea you can set up a node project, in the project root and then write a webpack compiler. Then you would need to create a react project without npx create-react-app.
Some useful reading:
I would strongly advise you not to do it because it is not like you will use any functions of your backend code directly in your frontend anyway.
What you could do is have the same folder structure in bot apps:
Project
- Backend
- feature 1
- Frontend
- src
- feature 1