Multi-stage Docker build for serving static content using React application

First install NodeJS:

sudo apt update
sudo apt install nodejs npm
node -v

Change the directory and generate the project:

cd Desktop/
npx create-react-app frontend
cd frontend/

Now, we will create a Dockerfile to serve the static content from build directory:

FROM node:alpine as builder
WORKDIR '/app'
COPY package.json .
RUN npm install
COPY . .
RUN npm run build

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

Build and copy the container ID:

docker build .

Run:

docker run -p8080:80 {{ container_ID }}

Open the browser at the http://localhost:8080 to see the static content of the app.