React js web app deployment in Docker
Date: 22-02-2021
Step 1: Create a Dockerfile in the directory root with below content based on your deployment procedure.
=====
FROM node:12.2.0-alpine as react_build
#also say
WORKDIR /home/ubuntu/workspace/
#copy the react app to the container
COPY . /home/ubuntu/workspace/
# #prepare the container for building react
RUN npm install –silent
RUN npm install react-scripts@3.0.1 -g –silent
RUN npm run build
# Setup static server
FROM nginx:stable-alpine
COPY –from=react_build /home/ubuntu/workspace /build /usr/share/nginx/html
COPY nginx/nginx.conf /etc/nginx/conf.d/default.conf
EXPOSE 80
CMD [“nginx”, “-g”, “daemon off;”]
=====
Step 2: Create nginx.conf file in nginx directory with below content.
=====
server {
listen 80;
server_name website name;
location / {
root /usr/share/nginx/html;
index index.html index.htm;
try_files $uri $uri/ /index.html;
}
}
=====
Step 3: Run the below command for docker container creation.
# sudo docker build –rm -t container name .
Step 4: Run the below command to run the container.
# sudo docker run -d -p 3000:80 -t container name
Step 5: You can check the website status on the browser.
http://website name:3000