CODEWITHSUNDEEP
node.jsreactjsamazon-web-servicesamazon-ec2
Rakesh C
Rakesh C

Reputation: 23

deploy react ,node in amazon web server

i have deployed my mern stack application to aws ec2 instance.the problem is that my react app is listen to port 3000 and my nodejs app listen to port 5000, and i also used tus-server in node js which is listen at port 8000, how can configure ngnix file.

server {
    listen 80;
    location / {
        proxy_pass http://PRIVATE_IP_EC2:3000;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
    }
}

If i run the above configuration in ngnix then only react app is runing, then i could not send any files to nodejs server.what can i do, i want all the ports should run.

Upvotes: 0

Views: 470

Answers (3)

Matus Dubrava
Matus Dubrava

Reputation: 14462

I have a feeling that if your React app is listening on port 3000 then you are doing something wrong. Isn't it that your create-react-app server is listening on port 3000? If so, you should be aware of the fact that this server is mainly for development purpose, not for production.

If the above is the case then what you should do is to build your React app using npm build command. Once your static website has been built, you can choose a hosting solution. The preferred way on AWS is to configure S3 bucket to use website hosting feature (you don't need to set up any web server such as Nginx) and upload contents of the build folder in your React app to that S3 bucket. If you choose this route, don't forget to add public read access to your bucket.

Upvotes: 0

Sweta Unagar
Sweta Unagar

Reputation: 41

You can add another location in same nginx configuration file with some prefix on which you want to run your app.

For Example if nodejs app's all API url start with /api prefix then you can use as

location ^~ /api/ {
   proxy_pass http://PRIVATE_IP_EC2:YOUR_NODEJS_APP_PORT;
   proxy_http_version 1.1;
   proxy_set_header Upgrade $http_upgrade;`enter code here`
   proxy_set_header Connection ‘upgrade’;
   proxy_set_header Host $host;
   proxy_cache_bypass $http_upgrade;
}

Upvotes: 1

Mobeen
Mobeen

Reputation: 985

You can create another nginx config with your subdomain (that will be pointing to your node app (I guess your backend). Then, in your react app use your sub-domain to connect to your back-end API's

Upvotes: 0

Related Questions