react-docker

.dockerignore

**/node_modules
**/npm-debug.log
build

README.md

• Create .dockerignore file
• Create nginx.conf file
• Create Dockerfile
• All in react-project root dir
• Now dockerize it

Build it with

sudo docker build . -t shivampip/rapp  

Run it

sudo docker run -p 4000:80 shivampip/rapp

Push it

sudo docker push shivampip/rapp

Dockerfile

FROM node:16-alpine AS builder
ENV NODE_ENV production
# Add a work directory
WORKDIR /app
# Cache and Install dependencies
COPY package.json .
COPY package-lock.json .
# RUN npm install --production
RUN npm install 
# Copy app files
COPY . .
# Build the app
RUN npm run build

# Bundle static assets with nginx
FROM nginx:1.21.0-alpine as production
ENV NODE_ENV production
# Copy built assets from builder
COPY --from=builder /app/build /usr/share/nginx/html
# Add your nginx.conf
COPY nginx.conf /etc/nginx/conf.d/default.conf
# Expose port
EXPOSE 80
# Start nginx
CMD ["nginx", "-g", "daemon off;"]

nginx.conf

server {
  listen 80;

  location / {
    root /usr/share/nginx/html/;
    include /etc/nginx/mime.types;
    try_files $uri $uri/ /index.html;
  }
}