React app running in docker container being served with nginx is blank

Question

I'm stuck on this issue of running a react app on a clients Linux server and even locally. There is an existing site being hosted on this same server which is being served with nginx. My goal is to integrate the new web app at /new-app. I haven't had any success with this though. I've tried adding a new file for my app at /sites-enabled/ and /sites-available/ with nginx configs but the closest I've gotten is to get the app to display at the ipaddress/new-app . So I've looked into docker as a solution but am getting stuck there as-well as the only thing that is served is the nginx welcome page.

heres my nginx/docker files

server {
  listen 80;
  location / {
    root   /usr/share/nginx/html;
    index  index.html index.htm;
    try_files $uri $uri/ /index.html;  }
  error_page 500 502 503 504 /50x.html;
  location = /50x.html {
    root  /usr/share/nginx/html;
  }
}

Dockerfile:

# Stage 0, "build-stage", based on Node.js to build the frontend
FROM node:alpine as build
WORKDIR /app
COPY package*.json /app/
RUN npm install
COPY . /app/
RUN npm run build

# Stage 1, based on NGINX to provide a configuration to be used with react-router
FROM nginx:alpine
COPY --from=build /app/build /usr/share/nginx.html
RUN rm /etc/nginx/conf.d/default.conf
COPY nginx/nginx.conf /etc/nginx/conf.d
EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]

Any advice/suggestions is greatly appreciated thanks!

Answer 1

COPY --from=build /app/build /usr/share/nginx.html

Seems like you're trying to copy your build into nginx html folder? So it should be

COPY --from=build /app/build /usr/share/nginx/html