how to structure a create-react-app project

Question

I am using django on the backend and on the front end I am using react with create-react-app.

I have different apps on my web page that are somewhat independent from each other:

mydomainname/home
mydomainname/foo
mydomainname/bar

They are all somewhat connected but logically completely different which is why I separated them.

Is this handled with only one create-react-app and one index.html file in the build folder? And something like the browser router package for the different apps?

For example, if I look at the Facebook homepage (in case I want to build that with React) I understand that my news feed and my profile page and other people's pages are all connected and share similar components which is why it would make sense to have one index.html file.

But if I create a new public page (eg for a business figure), are all these components and functionalities handled in the same one index.html file? I could imagine that this will run into memory leaks and performance issues, or is this not the case? I can't seem to find anything about that neither in the create-react-app documentation nor through google.

Answer 1

React is not Html. In React you have only one page named index.html in folder public . The "pages" in react are named as ' Components ', so you just create components and link them to each other. The first generated example component is App ( App.js ) component in src folder. All the transitions (transition from one component to second) will be done in index.html file.