Refactored dockerfile for production

.eslintignore

@@ -3,3 +3,5 @@ src/components/CheckIn/tagTemplate.ts
 package.json
 package-lock.json
 tsconfig.json
+docker-compose.yml
+Dockerfile

Dockerfile

@@ -1,15 +1,22 @@
-FROM node:20.10.0 AS build
-
-WORKDIR /usr/src/app
+# Step 1: Build Stage
+FROM node:20.10.0-alpine AS builder
+WORKDIR /talawa-admin
 
 COPY package*.json ./
-
 RUN npm install
 
 COPY . .
 
-RUN npm run build
+ENV NODE_ENV=production
+
+RUN yarn build
+
+#Step 2: Production
+FROM nginx:1.27.3-alpine AS production
 
-EXPOSE 4321
+ENV NODE_ENV=production
 
-CMD ["npm", "run", "serve"]
+COPY nginx.conf /etc/nginx/conf.d/default.conf
+COPY --from=builder /talawa-admin/build /usr/share/nginx/html
+EXPOSE 80
+CMD ["nginx", "-g", "daemon off;"]

docker-compose.yml

@@ -0,0 +1,11 @@
+services:
+  app:
+    build:
+      context: .
+    # Ideally these would be dynamically setup by the end user similar to .env
+    ports:
+      - '4321:80'
+    environment:
+      - REACT_APP_TALAWA_URL=http://localhost:4000/graphql/
+      - REACT_APP_BACKEND_WEBSOCKET_URL=ws://localhost:4000/graphql/
+      - PORT=4321

nginx.conf

@@ -0,0 +1,27 @@
+server {
+    listen 80;
+    server_name yourdomain.com;
+
+    root /usr/share/nginx/html;
+    index index.html;
+
+    location / {
+        try_files $uri /index.html;
+    }
+
+    location /graphql/ {
+        proxy_pass http://127.0.0.1:4000/graphql/;
+        # CORS should be made strict before deployment (currently allows access from any origin)
+        add_header Access-Control-Allow-Origin *;
+        add_header Access-Control-Allow-Methods "GET, POST, OPTIONS";
+        add_header Access-Control-Allow-Headers "Content-Type, Authorization";
+        proxy_http_version 1.1;
+        proxy_set_header Upgrade $http_upgrade;
+        proxy_set_header Connection "upgrade";
+        proxy_set_header Host $host;
+        proxy_cache_bypass $http_upgrade;
+    }
+
+    error_page 404 /index.html;
+
+}