Running a React App in Prod using Docer & Nginx

Question

I'm running a react app in prod in a docker container using the following Dockerfile

FROM node:16-alpine3.15 AS builder

WORKDIR /app
COPY . .
RUN yarn install && yarn build

FROM nginx
WORKDIR /usr/share/nginx/html
RUN rm -rf ./*
COPY --from=builder /app/build .
ENTRYPOINT ["nginx", "-g", "daemon off;"]

This runs the app at localhost:8080

I want to move this code to a remote host now. I've a an IP address, say 54.22.33.99, I want to spin up the container and run the app at the root of 54.22.33.99/ and not on 54.22.33.99:8080/ Can someone help me understand, how to do this? TIA

Answer 1

When you have Docker installed on the remote machine, you need to get the image onto the remote system. There are a few ways to do that:

1. Copy the Dockerfile and your source code to the remote machine and build it there
2. docker save the image on your local machine, copy the tar file to the remote machine and docker load it.
3. Push your image to a remote Docker registry and docker pull it on the remote host

When you have the image on the remote machine, you need to map the port it's listening on to port 80 on the host machine. Port 80 is the default http port, so when you don't type a port number in a URL, the request is made to port 80. If your app listens on port 8080 in the container, you map it to port 80 by using the -p 80:8080 option on your docker run command.