diff --git a/.gitignore b/.gitignore index 10b3639..f1217e8 100644 --- a/.gitignore +++ b/.gitignore @@ -14,6 +14,7 @@ dist-ssr *.local /.pnp .pnp.js +.venv # production /build diff --git a/Dockerfile.client b/Dockerfile.client new file mode 100644 index 0000000..9441cbc --- /dev/null +++ b/Dockerfile.client @@ -0,0 +1,16 @@ +FROM node:20-alpine as build-step +WORKDIR /app +ENV PATH /app/node_modules/.bin:$PATH +COPY package.json package-lock.json tsconfig.json tsconfig.node.json vite.config.ts index.html .eslintrc.cjs ./ +COPY ./src ./src +COPY ./public ./public +RUN npm install +RUN npm run build + +# Build step #2: build an nginx container +FROM nginx:stable-alpine +COPY --from=build-step /app/dist /usr/share/nginx/html +COPY deployment/nginx.default.conf /etc/nginx/conf.d/default.conf + +# Start Nginx when the container runs +CMD ["nginx", "-g", "daemon off;"] diff --git a/Dockerfile.server b/Dockerfile.server new file mode 100644 index 0000000..ddf6dea --- /dev/null +++ b/Dockerfile.server @@ -0,0 +1,11 @@ +FROM python:3.11 as server-step + +COPY ./data ./data +WORKDIR /app + +COPY requirements.txt api/app.py api/config.yaml ./ +RUN pip install -r ./requirements.txt +ENV FLASK_ENV production +EXPOSE 5000 +CMD ["gunicorn", "-b", ":5000", "app:app"] + diff --git a/README.md b/README.md index bb081a2..3a69fb3 100644 --- a/README.md +++ b/README.md @@ -10,3 +10,10 @@ This repository houses the Materials Cloud interactive phonons visualizer React - install backend dependencies with `pip install -r requirements.txt` - launch the backend with `python api/app.py` - launch the app with `npm start` + + +#### Running on docker +The project contains client and server stacks to containerize the application +You can run the full stack application on a Docker install machine typing +`docker compose up ` +on the terminal. You can reach to content via localhost:8080 port. \ No newline at end of file diff --git a/api/.flaskenv b/api/.flaskenv new file mode 100644 index 0000000..364d68d --- /dev/null +++ b/api/.flaskenv @@ -0,0 +1,2 @@ +FLASK_APP=app.py +FLASK_ENV=development \ No newline at end of file diff --git a/deployment/nginx.default.conf b/deployment/nginx.default.conf new file mode 100644 index 0000000..9ab11b9 --- /dev/null +++ b/deployment/nginx.default.conf @@ -0,0 +1,23 @@ +# nginx configuration for Docker + +server { + listen 80; + server_name localhost; + + root /usr/share/nginx/html; + index index.html; + error_page 500 502 503 504 /50x.html; + + location / { + try_files $uri $uri/ =404; + add_header Cache-Control "no-cache"; + } + + location /static { + expires 1y; + add_header Cache-Control "public"; + } + location /app { + proxy_pass http://app:5000; + } +} \ No newline at end of file diff --git a/docker-compose.yml b/docker-compose.yml new file mode 100644 index 0000000..bc4f61f --- /dev/null +++ b/docker-compose.yml @@ -0,0 +1,15 @@ +services: + app: + build: + context: . + dockerfile: Dockerfile.server + image: phonon-visualizer-server + ports: + - "5000:5000" + client: + build: + context: . + dockerfile: Dockerfile.client + image: phonon-visualizer-client + ports: + - "8080:80" \ No newline at end of file diff --git a/requirements.txt b/requirements.txt index 39733c0..1744a70 100644 --- a/requirements.txt +++ b/requirements.txt @@ -1,3 +1,4 @@ Flask==3.0.3 Flask-Cors==4.0.1 PyYAML==6.0.1 +gunicorn==22.0.0 \ No newline at end of file