I have created a MERN Stack project,Project is deployed on AWS in 2 parts(front-end and back-end), Front-end(React.js) is deployed in public subnet and Back-end(Node.js, Express, MongoDB) is deployed into private subnet, both subnets is in same VPC, public subnet is connect to IG(Internet Gateway) and private subnet is connected with NAT Gateway.
Front-end listening port: 3000 Backend-end listening port: 3300
Front-end and Back-end Secuirty Group: Inbound and Outbound rule:- All Traffic IPv4 0.0.0.0/0
Network ACL: All Traffic 0.0.0.0/0 allowed
I'm able to ping from Private Subnet to public internet, but not able to ping from front-end public subnet to private subnet.
Don't know what is happening.
I did troubleshoot many ways but not able to get the API response into front-end. I'm making API call to the Private Subnet IP of back-end EC2 instance.
In a MERN stack, your front-end React code runs in each user's web browser, on their local computer. All your front-end server is doing is serving up raw JavaScript files to the web browsers. The web browsers download the JavaScript files and then run them. Any API calls made by your React code are originating from the end-user's computer, not the "front-end server". Your back-end server has to be exposed and available on the Internet in order for your React code to make API calls.