'Showing NginX welcome page after Dockerizing

I have Dockerized my Nextjs App. It builds fine. But after building, it keep showing the nginx welcome page, not the actual home page of my application. Tried many things, it doesn't fix. It remains the same on server too. What is the problem in my setup. Here I am attaching my files.

This is my Dockerfile

FROM node:14.16.0 as builder

WORKDIR /app

ENV PATH /app/node_modules/.bin:$PATH

COPY ./package.json /app/

RUN npm install

COPY . /app

RUN npm run build 

FROM nginx:alpine
COPY --from=builder /app/build /usr/share/nginx/html

RUN rm /etc/nginx/conf.d/default.conf
COPY nginx/nginx.conf /etc/nginx/conf.d

EXPOSE 3000

CMD ["nginx", "-g", "daemon off;"]

This is my Docker-compose.yml

version: "3.8"
services:
  app:
    container_name: kup-frontend
    image: kup-frontend
    build:
      context: .
      dockerfile: ./Dockerfile
    ports:
      - 3000:3000
    volumes:
      - .:/app
      - /app/node_modules
      - /app/build
    restart: unless-stopped
    environment:
      - PORT=3000

This is my nginx.conf file

server {
    listen 3000;
    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;
    }
}


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source