9

I'm trying to serve a ReactJS app together with an API built with Spring Boot. I've run the script create-react-app on /public/ - as shown on the structure below - however, all relative paths from ReactJS seems to be broken when I try to access it from http://localhost:8080/public/index.html

What else do I need to do in order to correctly load the resources from ReactJS?

enter image description here

1 Answer 1

16

I suggest you create two projects:

  • one for your Spring Boot backend;
  • one for your React frontend, created with create-react-app.

In dev mode, you have to run the React development server with node: 'npm start'. You should define a proxy to your Spring Boot app: "proxy": "http://localhost:8080", to add to your package.json. Documentation of this mechanism is here. And you can execute your backend as usual with Gradle: ./gradlew bootRun.

In production deployment, you can generate a build of your React app with npm run build. The static files produced by create-react-app can be placed in a static directory in your Spring Boot application, for instance in src/main/resources/static/ (docs about static content with Spring Boot)

I hope this helps!

Sign up to request clarification or add additional context in comments.

2 Comments

Awesome, I'll test it! Thank you very much
NB if you go down this road you need to bear in mind that in the production system it is a good idea to bundle them together using Docker, so that both systems are started on the same host and the configured proxy continues to work in production without needing to mess around with editing the package.json during the build process.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.