Ad

Recommendations On Deploying Create-react-app With Node Backend

I am trying to deploy my React app that uses a node.js express backend (running on a AWS EC2 instance). I am having trouble deciding how to deploy my React App to make sure it can fetch from the backend.

  1. I can set my website example.com to direct to a AWS S3 static hosting that has my React app. In this case, I would have to have to hard code my ec2 public ip e.g. fetch("http://12.35.143.34/api/users/1") in the React code.

  2. I can set my website example.com to direct to an ec2 instance with Nginx that will direct /api calls to the server and any other type of calls to the S3 bucket.

I read different posts about both ways so I am confused on which way is right.

Edit: Or is there a third option such as an api subdomain?

Ad

Answer

There are many ways to run a NodeJS based application on AWS. The best one for you depends on your case, and how your app is developed.

  1. Use AWS Elastic Beanstalk
  • It is a PaaS service that lets you run your application on top of AWS infrastructure, without you having to configure these services individually.
  • Documentation
  1. Use AWS Lambda + AWS API Gateway
  1. EC2 using ELB and Auto Scaling Groups.
  • Regardless of the size of your application, you should run it with some level of high availability and load balancing.
  • You shouldn't run your application on just one node; you should use an Auto Scaling Group.
  • You shouldn't publish your EC2 instances directly on the Internet; you should use an Application Load Balancer.
  • If your application uses a database, you should try to move it to RDS, and not run it by yourself.

And finally, to answer your question, I would recommend 3: you should use multiple CloudFront origins. Us an S3 bucket origin to hold the static data, and an ELB origin for the dynamic, non-cacheable content. Check this post for more information on how to do it.

If you own a domain, you can also create a certificate and serve your content through HTTPS, handled by CloudFront.

I hope it helps.

Ad
source: stackoverflow.com
Ad