From bd5ae3cbc3f0611059aa1521d7da82264b06a9b7 Mon Sep 17 00:00:00 2001 From: Ewen Date: Mon, 13 May 2024 15:50:02 +0200 Subject: [PATCH] wip: production --- README.md | 2 +- api/Dockerfile | 12 ++++-- docker-compose.dev.yml | 22 ++++++++++ docker-compose.yml | 14 +++---- frontend/Dockerfile | 19 ++++++++- frontend/nginx/nginx.conf | 42 +++++++++++++++++++ .../components/__tests__/HelloWorld.spec.ts | 11 ----- frontend/src/stores/counter.ts | 12 ------ 8 files changed, 99 insertions(+), 35 deletions(-) create mode 100644 docker-compose.dev.yml create mode 100644 frontend/nginx/nginx.conf delete mode 100644 frontend/src/components/__tests__/HelloWorld.spec.ts delete mode 100644 frontend/src/stores/counter.ts diff --git a/README.md b/README.md index 4ae51ce..ea30f33 100644 --- a/README.md +++ b/README.md @@ -33,7 +33,7 @@ This project consists of two parts : ### Using Docker, for development purposes You will need to have Docker and Docker Compose installed. -Clone the repository, go to its root and run `docker-compose up -d`. +Clone the repository, go to its root and run `docker-compose -f docker-compose.dev.yml up -d`. To use the backend directly, go to the page [http://localhost:8080/api/feed/](http://localhost:8080/api/feed/) and start adding parameters! ### For production diff --git a/api/Dockerfile b/api/Dockerfile index 9766b68..e8d5d36 100644 --- a/api/Dockerfile +++ b/api/Dockerfile @@ -1,4 +1,4 @@ -FROM python:3.11-alpine as backend +FROM python:3.11-alpine as backend-requirements RUN apk update \ && apk add --no-cache \ @@ -21,5 +21,11 @@ RUN poetry --version RUN /root/.local/bin/poetry install -#CMD ["poetry", "run", "gunicorn", "--bind=0.0.0.0:8080", "--reload", "app:app"] -CMD ["poetry", "run", "flask", "--app", "api", "run", "--host=0.0.0.0", "--port=8080", "--debug"] \ No newline at end of file +FROM backend-requirements as backend-dev +CMD ["poetry", "run", "flask", "--app", "api", "run", "--host=0.0.0.0", "--port=8080", "--debug"] + +FROM backend-requirements as final +WORKDIR /app +COPY . . +# CMD ["ls", "-lah"] +CMD ["poetry", "run", "gunicorn", "--bind=0.0.0.0:8080", "api:create_app()"] \ No newline at end of file diff --git a/docker-compose.dev.yml b/docker-compose.dev.yml new file mode 100644 index 0000000..e1b62d6 --- /dev/null +++ b/docker-compose.dev.yml @@ -0,0 +1,22 @@ +services: + api: + env_file: + - .env.dev + build: + context: ./api + dockerfile: Dockerfile + target: backend-dev + ports: + - 8080:8080 + volumes: + - ./api:/app + + frontend: + env_file: + - .env.dev + build: + context: ./frontend + dockerfile: Dockerfile + target: frontend-dev + ports: + - 5173:5173 \ No newline at end of file diff --git a/docker-compose.yml b/docker-compose.yml index 6fa85a0..1e39feb 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -1,22 +1,22 @@ services: api: env_file: - - .env.dev + - .env build: context: ./api dockerfile: Dockerfile - ports: - - 8080:8080 - volumes: - - ./api:/app + target: final frontend: env_file: - - .env.dev + - .env build: context: ./frontend dockerfile: Dockerfile + target: final + args: + - VITE_API_ENDPOINT=${VITE_API_ENDPOINT} ports: - 5173:5173 volumes: - - ./frontend:/app \ No newline at end of file + - ./frontend/nginx/nginx.conf:/etc/nginx/nginx.conf \ No newline at end of file diff --git a/frontend/Dockerfile b/frontend/Dockerfile index 20b9385..5df25fd 100644 --- a/frontend/Dockerfile +++ b/frontend/Dockerfile @@ -1,10 +1,27 @@ -FROM node:21-alpine as frontend +FROM node:21-alpine as frontend-requirements RUN npm install -g pnpm WORKDIR /app COPY package*.json ./ RUN pnpm install + +FROM frontend-requirements as frontend-dev CMD ["pnpm", "run", "dev", "--host", "0.0.0.0"] +FROM frontend-requirements as build + +ARG VITE_API_ENDPOINT +ENV VITE_API_ENDPOINT=${VITE_API_ENDPOINT}} +WORKDIR /app +COPY . ./ +RUN pnpm run build + +FROM nginx:1.23 as final +COPY --from=build /app/dist /app/dist + +ARG nginx_uid=33 +ARG nginx_gid=33 + +RUN usermod -u ${nginx_uid} -o nginx && groupmod -g ${nginx_gid} -o nginx diff --git a/frontend/nginx/nginx.conf b/frontend/nginx/nginx.conf new file mode 100644 index 0000000..b2159ca --- /dev/null +++ b/frontend/nginx/nginx.conf @@ -0,0 +1,42 @@ +error_log /var/log/nginx/error.log; + + +events { + worker_connections 1024; +} + + +http { + include /etc/nginx/mime.types; + default_type application/octet-stream; + + log_format main '$remote_addr - $remote_user [$time_local] "$request" ' + '$status $body_bytes_sent "$http_referer" ' + '"$http_user_agent" "$http_x_forwarded_for"'; + access_log /var/log/nginx/access.log main; + + sendfile on; + keepalive_timeout 65; + + upstream api { + server api:8080; + } + + server { + listen 80; + server_name ${HOSTNAME}; + root /app/dist; + + add_header Referrer-Policy "strict-origin-when-cross-origin"; + + location / { + try_files $uri $uri/ /index.html; + } + + location ^~ /api/ { + proxy_pass http://api; + } + } + + include /etc/nginx/conf.d/*.conf; +} \ No newline at end of file diff --git a/frontend/src/components/__tests__/HelloWorld.spec.ts b/frontend/src/components/__tests__/HelloWorld.spec.ts deleted file mode 100644 index 2533202..0000000 --- a/frontend/src/components/__tests__/HelloWorld.spec.ts +++ /dev/null @@ -1,11 +0,0 @@ -import { describe, it, expect } from 'vitest' - -import { mount } from '@vue/test-utils' -import HelloWorld from '../HelloWorld.vue' - -describe('HelloWorld', () => { - it('renders properly', () => { - const wrapper = mount(HelloWorld, { props: { msg: 'Hello Vitest' } }) - expect(wrapper.text()).toContain('Hello Vitest') - }) -}) diff --git a/frontend/src/stores/counter.ts b/frontend/src/stores/counter.ts deleted file mode 100644 index b6757ba..0000000 --- a/frontend/src/stores/counter.ts +++ /dev/null @@ -1,12 +0,0 @@ -import { ref, computed } from 'vue' -import { defineStore } from 'pinia' - -export const useCounterStore = defineStore('counter', () => { - const count = ref(0) - const doubleCount = computed(() => count.value * 2) - function increment() { - count.value++ - } - - return { count, doubleCount, increment } -})