0

I am following this blog post to create a spring boot with reactjs project.

In order for my project to work, I noticed that I have to have both my nodejs server and my spring boot embedded tomcat server running (I used yarn start to start the react app). Will this always be the case? Does the nodejs server need to be running in order to render the spring boot response into my reactjs UI? Or can I only have my tomcat server running.

Also, I noticed that in my react app it starts on localhost:3000, whereas, my spring boot app starts on localhost:9080. And in my package.json I have proxy defined as localhost:8080. How can I have both apps be under the same host and serve port?

Improve this question
2
  • Different ports would only be during development, so you can take advantage of development tools for both platforms individually. In production, React would be served as static HTML/CSS/JS resources. The development proxy is meant to replicate the production environment where React would be served as static resources, making HTTP calls to the endpoints in Spring. Commented Sep 26, 2018 at 15:13
  • @AlexanderStaroselsky Hmm but how does the jar file get generated? Commented Sep 27, 2018 at 1:57

2 Answers 2

Reset to default
2

Follow my below steps and you would be good.

  1. In your spring boot application under application/properties do not define any port so your sprig boot can run by default to 8080 or 9080 is fine if you are ok to run on it.

  2. Create fat jar of your spring boot project

  3. deploy it to /opt/your project name on server.

  4. run you boot app with nohup java -jar jarname & or you create service for it read spring documentation to run your jar as service.

  5. it will start your app on 8090 or 8080 whatever you want.

Now lets come to your front end app which is in react.

to order to run your front end app there are couple of ways.

  1. install apache or ngnix server on your machine
  2. run yarn build which will generate your optimized files under build folder, make sure you define your app backend url.
  3. deploy all generated files under apache/ngnix root folder for ex /var/www/html

Now if you have lets say domain name example.com then your front end app can be accessible with http://www.example.com and backend apis are available at http://www.example.com:8080 make sure 8080 and 80 are allowed.

Now you think,no i want to also want my apis to be accessible by www.example.com then first make sure there context path is defined your apis so they available with base path lets say /api is your base path.

then define proxy in apache or ngnix server.

<VirtualHost *:80>
  ProxyRequests Off
  ProxyPass /api http://localhost:8080/api
  ProxyPassReverse /api http://localhost:8080/api
</VirtualHost>

Now you are good to also access your apis at www.example.com/api

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

Comments

0

@Robin, I made a project to my last company using the same technologies about 9 months ago. I put it in production before I leave and it was a successful! I have the boilerplate of this project https://github.com/gasparteixeira/springboot-reactjs-app.

Take a look at the structure. Example: For development keep using the spring boot tools and yarn start for reactjs! But when you're going to generate the jar/war be sure you have built (yarn run build) inside your react project.

Improve this answer

2 Comments

You commented out the execute section of npm in your pom.xml. How come?
@Robben take a look at this Maven Plugin (mvnrepository.com/artifact/com.github.eirslett/…). Basically you can execute npm /node commands when your mvn is building. Take a look ah the the pom.xml - link above.

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.