Building multi-container docker-compose fails to build frontend - docker

Question

this is my first time deploying a MERN stack application using docker-compose. The backend (Express Server & MongoDB) is working well. I can post data with Postman and fetch data successfully. But my React app with NGINX conf proxy is returning an error during build.
production_frontend_1 exited with code 127
frontend_1 | /docker-entrypoint.sh: exec: line 38: yarn: not found
frontend_1 | /docker-entrypoint.sh: exec: line 38: yarn: not found
Here's my React Dockerfile
FROM node:12.18.2 as build
# RUN npm install -g yarn
WORKDIR /app
ENV NODE_ENV=production
COPY package*.json ./
RUN yarn install && yarn cache clean
COPY . /app
ARG SERVER_APP_API
ARG SERVER_REST_API
ENV SERVER_REST_API ${SERVER_REST_API:-http://localhost:7000/api/v1/}
RUN SERVER_REST_API=${SERVER_REST_API} yarn run build
# ------------------------------------------------------
# Production Build
# ------------------------------------------------------
FROM nginx:alpine
COPY --from=build /app/build /usr/share/nginx/html
RUN rm /etc/nginx/conf.d/default.conf
COPY ./nginx/nginx.conf /etc/nginx/conf.d/default.conf
EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]
Here's my NGINX.conf
server {
listen 80;
server_name localhost;
location / {
# This would be the directory where your React app's static files are stored at
root /usr/share/nginx/html;
index index.html;
try_files $uri /index.html;
}
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root /usr/share/nginx/html;
}
}
Here's my docker-compose.yml
version: '3.8'
services:
backend:
ports:
- 5555:5555
build:
context: ./backend
dockerfile: ./Dockerfile
restart: unless-stopped
networks:
- developer-tier
depends_on:
- db
command: npm run start
env_file: ./backend/.env
environment:
- CLIENT_URL=http://localhost:3001/
- NODE_ENV=production
- DATABASE_URL=mongodb://db:27017/developer
frontend:
stdin_open: true
build:
context: ./frontend
dockerfile: ./Dockerfile
ports:
- 3001:3001
restart: unless-stopped
depends_on:
- backend
env_file: ./frontend/.env
networks:
- developer-tier
volumes:
- ./frontend/:/frontend/src/app
- /app/node_modules/
command: yarn start
db:
image: mongo:latest
ports:
- 27017:27017
restart: always
networks:
- developer-tier
volumes:
- dev-data:/data/db
volumes:
dev-data:
driver: local
networks:
developer-tier:
driver: bridge