Using one NodeJs docker image inside React Container - docker

Question

Step1: I have created a local docker image of one NodeJS app.
Here is the dockerfile for this app -
FROM node:8
# Create app directory
WORKDIR /usr/src/app
# Install app dependencies
# A wildcard is used to ensure both package.json AND package-lock.json are copied
# where available (npm#5+)
COPY package*.json ./
RUN npm install
# If you are building your code for production
# RUN npm ci --only=production
# Bundle app source
COPY . .
#EXPOSE 8080
CMD [ "npm", "start" ]
**Step 2:**Then I built a docker image for this Node app. Here is the build command output -
C:\Users\shibathethinker\Documents\GitHub\NodeProjects\API_Proxy_ABN>docker build -t api-proxy .
Sending build context to Docker daemon 8.637MB
Step 1/6 : FROM node:8
---> 0bf36d7ccc1e
Step 2/6 : WORKDIR /usr/src/app
---> Running in 7187d65639f1
Removing intermediate container 7187d65639f1
---> 0e34dc93439c
Step 3/6 : COPY package*.json ./
---> 47c0d0ca8c77
Step 4/6 : RUN npm install
---> Running in d7e5163371df
npm WARN api_proxy#1.0.0 No repository field.
added 98 packages from 91 contributors and audited 194 packages in 8.598s
found 0 vulnerabilities
Removing intermediate container d7e5163371df
---> 72da705ae792
Step 5/6 : COPY . .
---> 0293df6aa27d
Step 6/6 : CMD [ "npm", "start" ]
---> Running in 251e98c0a0ae
Removing intermediate container 251e98c0a0ae
---> a92d8a95b8cd
Successfully built a92d8a95b8cd
Successfully tagged api-proxy:latest
SECURITY WARNING: You are building a Docker image from Windows against a non-Windows Docker host. All files and directories added to build context will have '-rwxr-xr-x' permissions. It is recommended to double check and reset permissions for sensitive files and directories.
**Step 3:**Then, I wanted to use this docker image in another 'React' app.
Here is the Dockerfile of the app -
FROM api-proxy:latest
WORKDIR /app
RUN npm install
CMD [ "npm", "start" ]
# stage: 2 — the production environment
FROM nginx:alpine
#COPY —from=react-build /app/build /usr/share/nginx/html
#COPY nginx.conf /etc/nginx/conf.d/default.conf
COPY /build /usr/share/nginx/html
EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]
Step4: Now I built and ran this docker image generated on step 3.
Question:
It looks like the node app is not running on the newly created docker container.
If I 'ssh' into the docker container I can not see any node server running there.
I also could not find the WORKDIR (/usr/src/app) created in the step1 in this container.
What I am doing wrong?
Please let me know if I can clarify further.

Answer 1

You are doing a multi-stage docker build.You are building your application using nodejs (download dependencies and minification build) and copying and running it on nginx web server.

Answer 2

Nodejs server can be in its own independent container, which i think you have already done. The client would actually be a webserver for e.g. nginx, apache etc. that would serve the build of your react app. In the end, you will have 2 containers running: 1 for nodejs server and 1 for nginx webserver.
To place the build of your react app into this nginx webserver, you will use multi-stage build. In the first stage you will build your react app and in the second stage you will use nginx image and copy the react build from the first stage into the html folder of the nginx image.