React project dockerization

Dockerfile

@@ -1 +1,24 @@
-# ADD DOCKERFILE CONTENTS HERE
+
+FROM node:18-alpine AS build
+
+WORKDIR /app
+
+COPY package*.json ./
+
+RUN npm ci --silent
+
+COPY . .
+
+RUN npm run build
+
+FROM nginx:alpine
+
+RUN rm -rf /etc/nginx/conf.d/*
+
+COPY nginx.conf /etc/nginx/conf.d/default.conf
+
+COPY --from=build /app/build /usr/share/nginx/html
+
+EXPOSE 80
+
+CMD ["nginx", "-g", "daemon off;"]

docker-compose.yml

@@ -1 +1,12 @@
-# ADD DOCKER-COMPOSE CONTENTS HERE
+# ADD DOCKER-COMPOSE CONTENTS HERE
+version: "3.8"
+
+services:
+  react-app:
+    build:
+      context: .
+      dockerfile: Dockerfile
+    container_name: react_app
+    ports:
+      - "3000:80"  
+    restart: unless-stopped

nginx.conf

@@ -1 +1,15 @@
-# ADD NGINX CONTENTS HERE
+# ADD NGINX CONTENTS HERE
+server {
+    listen 80;
+    server_name _;
+
+    root /usr/share/nginx/html;
+    index index.html index.htm;
+
+    location / {
+        try_files $uri $uri/ /index.html;
+    }
+
+    add_header X-Frame-Options "SAMEORIGIN";
+    add_header X-Content-Type-Options "nosniff";
+}