From c233cc0d5c1a183382ef58b9c5d3d7bd2c34d3f1 Mon Sep 17 00:00:00 2001 From: Hyunggyu Jang Date: Tue, 21 Mar 2023 12:40:37 +0900 Subject: [PATCH 1/4] Move Dockerfiles into one toplevel Dockerfile --- .dockerignore | 2 ++ Dockerfile | 27 +++++++++++++++++ api/.dockerignore | 2 -- api/Dockerfile | 16 ---------- docker-compose.yml | 75 +++++++++++++++++----------------------------- 5 files changed, 56 insertions(+), 66 deletions(-) create mode 100644 .dockerignore create mode 100644 Dockerfile delete mode 100644 api/.dockerignore delete mode 100644 api/Dockerfile diff --git a/.dockerignore b/.dockerignore new file mode 100644 index 0000000000..2ca2e86e87 --- /dev/null +++ b/.dockerignore @@ -0,0 +1,2 @@ +**/node_modules +**/.env diff --git a/Dockerfile b/Dockerfile new file mode 100644 index 0000000000..f1dc95b254 --- /dev/null +++ b/Dockerfile @@ -0,0 +1,27 @@ +FROM node:19-alpine AS react-client +WORKDIR /client +# copy package.json into the container at /client +COPY /client/package*.json /client/ +# install dependencies +RUN npm ci +# Copy the current directory contents into the container at /client +COPY /client/ /client/ +# Build webpack artifacts +RUN npm run build + +FROM node:19-alpine AS node-api +WORKDIR /api +# copy package.json into the container at /api +COPY /api/package*.json /api/ +# install dependencies +RUN npm ci +# Copy the current directory contents into the container at /api +COPY /api/ /api/ +# Copy the client side code +COPY --from=react-client /client/public /client/public +# Make port 3080 available to the world outside this container +EXPOSE 3080 +# Expose the server to 0.0.0.0 +ENV HOST=0.0.0.0 +# Run the app when the container launches +CMD ["npm", "start"] diff --git a/api/.dockerignore b/api/.dockerignore deleted file mode 100644 index 7af7f04757..0000000000 --- a/api/.dockerignore +++ /dev/null @@ -1,2 +0,0 @@ -/node_modules -.env \ No newline at end of file diff --git a/api/Dockerfile b/api/Dockerfile deleted file mode 100644 index d417bf1ec4..0000000000 --- a/api/Dockerfile +++ /dev/null @@ -1,16 +0,0 @@ -FROM node:19-alpine -WORKDIR /api -# copy package.json into the container at /api -COPY package*.json /api/ -# install dependencies -RUN npm ci -# Copy the current directory contents into the container at /api -COPY . /api/ -# Make port 3080 available to the world outside this container -EXPOSE 3080 -# Expose the server to 0.0.0.0 -ENV HOST=0.0.0.0 -# Run the app when the container launches -CMD ["npm", "start"] - -# docker build -t node-api . diff --git a/docker-compose.yml b/docker-compose.yml index 401055f988..6d452f0f32 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -1,50 +1,29 @@ -version: "2" +version: "3.4" services: - client: - image: react-client - build: ./client - restart: always - ports: - - "3080:80" - volumes: - - ./client:/client - - /client/node_modules - links: - - api - networks: - - webappnetwork - api: - image: node-api - build: ./api - restart: always - env_file: - - ./api/.env - environment: - - HOST=0.0.0.0 - - NODE_ENV=production - - MONGO_URI=mongodb://mongodb:27017/chatgpt-clone - ports: - - "9000:3080" - volumes: - - ./api:/api - - /api/node_modules - depends_on: - - mongodb - networks: - - webappnetwork - mongodb: - image: mongo - restart: always - container_name: mongodb - volumes: - - ./data-node:/data/db - ports: - - 27020:27017 - command: mongod --noauth - networks: - - webappnetwork - -networks: - webappnetwork: - driver: bridge + api: + ports: + - 3080:3080 + depends_on: + - mongodb + image: node-api + build: + context: . + target: node-api + restart: always + env_file: + - ./api/.env + environment: + - HOST=0.0.0.0 + - NODE_ENV=production + - MONGO_URI=mongodb://mongodb:27017/chatgpt-clone + volumes: + - ./api:/api + - /api/node_modules + mongodb: + image: mongo + restart: always + container_name: mongodb + volumes: + - ./data-node:/data/db + command: mongod --noauth From 36f3d37ecce971efa65df3b96567c32ce7ea6c9f Mon Sep 17 00:00:00 2001 From: Hyunggyu Jang Date: Tue, 21 Mar 2023 12:41:15 +0900 Subject: [PATCH 2/4] Remove nginx setting --- client/.dockerignore | 2 -- client/Dockerfile | 22 ---------------------- client/nginx.conf | 15 --------------- 3 files changed, 39 deletions(-) delete mode 100644 client/.dockerignore delete mode 100644 client/Dockerfile delete mode 100644 client/nginx.conf diff --git a/client/.dockerignore b/client/.dockerignore deleted file mode 100644 index 7af7f04757..0000000000 --- a/client/.dockerignore +++ /dev/null @@ -1,2 +0,0 @@ -/node_modules -.env \ No newline at end of file diff --git a/client/Dockerfile b/client/Dockerfile deleted file mode 100644 index 59148137a4..0000000000 --- a/client/Dockerfile +++ /dev/null @@ -1,22 +0,0 @@ -# Stage 1 -FROM node:19-alpine as builder -WORKDIR /client -# copy package.json into the container at /client -COPY package*.json /client/ -# install dependencies -RUN npm ci -# Copy the current directory contents into the container at /client -COPY . /client/ -# Build webpack artifacts -RUN npm run build - -# Stage 2 -FROM nginx:stable-alpine -WORKDIR /usr/share/nginx/html -RUN rm -rf ./* -COPY --from=builder /client/public /usr/share/nginx/html -# Add your nginx.conf -COPY nginx.conf /etc/nginx/conf.d/default.conf -ENTRYPOINT ["nginx", "-g", "daemon off;"] - -# docker build -t react-client . diff --git a/client/nginx.conf b/client/nginx.conf deleted file mode 100644 index 1924aded1e..0000000000 --- a/client/nginx.conf +++ /dev/null @@ -1,15 +0,0 @@ -server { - listen 80; - server_name localhost; - - location / { - # Serve your React app - root /usr/share/nginx/html; - index index.html; - } - - location /api { - # Proxy requests to the API service - proxy_pass http://api:3080/api; - } -} From 40ed6fa9eccba7422e3ad543923d58c3de794fe6 Mon Sep 17 00:00:00 2001 From: Hyunggyu Jang Date: Wed, 22 Mar 2023 22:59:29 +0900 Subject: [PATCH 3/4] Provide nginx docker build recipe --- Dockerfile | 8 ++++++++ client/nginx.conf | 15 +++++++++++++++ docker-compose.yml | 15 ++++++++++++++- 3 files changed, 37 insertions(+), 1 deletion(-) create mode 100644 client/nginx.conf diff --git a/Dockerfile b/Dockerfile index f1dc95b254..ce95f49f45 100644 --- a/Dockerfile +++ b/Dockerfile @@ -25,3 +25,11 @@ EXPOSE 3080 ENV HOST=0.0.0.0 # Run the app when the container launches CMD ["npm", "start"] + +# Optional: for client with nginx routing +FROM nginx:stable-alpine AS nginx-client +WORKDIR /usr/share/nginx/html +COPY --from=react-client /client/public /usr/share/nginx/html +# Add your nginx.conf +COPY /client/nginx.conf /etc/nginx/conf.d/default.conf +ENTRYPOINT ["nginx", "-g", "daemon off;"] diff --git a/client/nginx.conf b/client/nginx.conf new file mode 100644 index 0000000000..1924aded1e --- /dev/null +++ b/client/nginx.conf @@ -0,0 +1,15 @@ +server { + listen 80; + server_name localhost; + + location / { + # Serve your React app + root /usr/share/nginx/html; + index index.html; + } + + location /api { + # Proxy requests to the API service + proxy_pass http://api:3080/api; + } +} diff --git a/docker-compose.yml b/docker-compose.yml index 6d452f0f32..3c1b061638 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -1,9 +1,21 @@ version: "3.4" services: + # client: + # image: react-client + # build: + # context: . + # target: nginx-client + # restart: always + # ports: + # - 3080:80 + # volumes: + # - /client/node_modules + # depends_on: + # - api api: ports: - - 3080:3080 + - 3080:3080 # Change it to 9000:3080 if you want to use nginx depends_on: - mongodb image: node-api @@ -18,6 +30,7 @@ services: - NODE_ENV=production - MONGO_URI=mongodb://mongodb:27017/chatgpt-clone volumes: + - /client/node_modules - ./api:/api - /api/node_modules mongodb: From f5d102b7bd7aa42f7879a17cee21f475d22e286d Mon Sep 17 00:00:00 2001 From: HyunggyuJang Date: Wed, 22 Mar 2023 23:20:03 +0900 Subject: [PATCH 4/4] Update docker-compose.yml --- docker-compose.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docker-compose.yml b/docker-compose.yml index 3c1b061638..bb65f6588b 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -2,7 +2,7 @@ version: "3.4" services: # client: - # image: react-client + # image: nginx-client # build: # context: . # target: nginx-client