diff --git a/ReactTool/backend/Dockerfile b/ReactTool/backend/Dockerfile index 441ca8e..944dd22 100644 --- a/ReactTool/backend/Dockerfile +++ b/ReactTool/backend/Dockerfile @@ -6,10 +6,10 @@ COPY Pipfile Pipfile.lock ./ RUN pip install pipenv && \ pipenv install --system --deploy && \ - pip install flask-cors + pip install flask-cors tinydb -# Create necessary directories for data storage -RUN mkdir -p /app/surveys/quiz +# Create directory for database +RUN mkdir -p /app/data COPY . . diff --git a/ReactTool/backend/app.py b/ReactTool/backend/app.py index c68caac..ad4900f 100755 --- a/ReactTool/backend/app.py +++ b/ReactTool/backend/app.py @@ -14,12 +14,17 @@ import pandas as pd import db_conf from flask import send_file from flask_cors import CORS +from tinydb import TinyDB #from flask_mail import Mail, Message #import firebase_admin #from firebase_admin import credentials, firestore, initialize_app, firebase app = Flask(__name__, static_folder='../frontend/build', static_url_path='/') CORS(app) # Add this line + +db = TinyDB('/app/data/responses.json') +responses_table = db.table('responses') + app.config['MYSQL_DATABASE_HOST'] = db_conf.host app.config['MYSQL_DATABASE_USER'] = db_conf.user app.config['MYSQL_DATABASE_PASSWORD'] = db_conf.password @@ -105,10 +110,11 @@ def record_responses_to_db(): # msg = Message("Quiz Response for " + str(session_id),sender='minivlat@gmail.com', recipients=['minivlat@gmail.com']) # msg.body = data_send # mail.send(msg) - fname = str(session_id)+'.txt' - fname = './surveys/quiz/' + fname - with open(fname, 'w+') as test: - test.write(json.dumps(data) + "\n") + # fname = str(session_id)+'.txt' + # fname = './surveys/quiz/' + fname + responses_table.insert(data) + # with open(fname, 'w+') as test: + # test.write(json.dumps(data) + "\n") print('TODO: Record quiz responses into a file or DB') print('Collected quiz data: ', data) diff --git a/ReactTool/frontend/.env b/ReactTool/frontend/.env new file mode 100644 index 0000000..49ffa03 --- /dev/null +++ b/ReactTool/frontend/.env @@ -0,0 +1 @@ +REACT_APP_API_URL=http://localhost:8000 diff --git a/ReactTool/frontend/.env.production b/ReactTool/frontend/.env.production new file mode 100644 index 0000000..5fdcc7d --- /dev/null +++ b/ReactTool/frontend/.env.production @@ -0,0 +1 @@ +REACT_APP_API_URL=https://mini-vlat-ua.duckdns.org/api diff --git a/ReactTool/frontend/Dockerfile.prod b/ReactTool/frontend/Dockerfile.prod new file mode 100644 index 0000000..b801352 --- /dev/null +++ b/ReactTool/frontend/Dockerfile.prod @@ -0,0 +1,14 @@ +# ReactTool/frontend/Dockerfile.prod +FROM node:16 as build + +WORKDIR /app +COPY package*.json ./ +COPY yarn.lock ./ + +RUN yarn install + +COPY . . +RUN yarn build + +FROM nginx:alpine +COPY --from=build /app/build /usr/share/nginx/html diff --git a/ReactTool/frontend/src/pages/tutorial.js b/ReactTool/frontend/src/pages/tutorial.js index f7912c2..a9ab428 100644 --- a/ReactTool/frontend/src/pages/tutorial.js +++ b/ReactTool/frontend/src/pages/tutorial.js @@ -31,7 +31,7 @@ class Tutorial extends Component { componentDidMount() { - fetch('http://localhost:8000/new_session_id', { + fetch(`${process.env.REACT_APP_API_URL}/new_session_id`, { headers: { 'Accept': 'application/json', 'Content-Type': 'application/json' }, method: 'POST', body: JSON.stringify({ diff --git a/ReactTool/frontend/src/pages/visualization_quiz.js b/ReactTool/frontend/src/pages/visualization_quiz.js index e61586a..bdda02e 100644 --- a/ReactTool/frontend/src/pages/visualization_quiz.js +++ b/ReactTool/frontend/src/pages/visualization_quiz.js @@ -178,7 +178,7 @@ class VisQuiz extends Component { on_survey_click() { - fetch('http://localhost:8000/record_responses_to_db', { + fetch(`${process.env.REACT_APP_API_URL}//record_responses_to_db`, { headers: { 'Accept': 'application/json', 'Content-Type': 'application/json' }, method: 'POST', body: JSON.stringify({ diff --git a/docker-compose.prod.yml b/docker-compose.prod.yml new file mode 100644 index 0000000..d2d4865 --- /dev/null +++ b/docker-compose.prod.yml @@ -0,0 +1,61 @@ +# docker-compose.prod.yml +version: '3.8' + +services: + traefik: + image: traefik:v2.10 + command: + - "--api.insecure=false" + - "--providers.docker=true" + - "--providers.docker.exposedbydefault=false" + - "--entrypoints.web.address=:80" + - "--entrypoints.websecure.address=:443" + - "--certificatesresolvers.myresolver.acme.tlschallenge=true" + - "--certificatesresolvers.myresolver.acme.email=ptrvtch@protonmail.com" + - "--certificatesresolvers.myresolver.acme.storage=/letsencrypt/acme.json" + ports: + - "80:80" + - "443:443" + volumes: + - "/var/run/docker.sock:/var/run/docker.sock:ro" + - "./letsencrypt:/letsencrypt" + networks: + - web + + frontend: + build: + context: ./ReactTool/frontend + args: + - NODE_ENV=production + labels: + - "traefik.enable=true" + - "traefik.http.routers.frontend.rule=Host(`mini-vlat-ua.duckdns.org`)" + - "traefik.http.routers.frontend.entrypoints=websecure" + - "traefik.http.routers.frontend.tls.certresolver=myresolver" + - "traefik.http.services.frontend.loadbalancer.server.port=80" + networks: + - web + depends_on: + - backend + + backend: + build: + context: ./ReactTool/backend + volumes: + - ./data/db:/app/data + environment: + - FLASK_ENV=production + labels: + - "traefik.enable=true" + - "traefik.http.routers.backend.rule=Host(`mini-vlat-ua.duckdns.org`) && PathPrefix(`/api`)" + - "traefik.http.routers.backend.entrypoints=websecure" + - "traefik.http.routers.backend.tls.certresolver=myresolver" + - "traefik.http.services.backend.loadbalancer.server.port=5000" + - "traefik.http.middlewares.backend-strip.stripprefix.prefixes=/api" + - "traefik.http.routers.backend.middlewares=backend-strip@docker" + networks: + - web + +networks: + web: + driver: bridge diff --git a/docker-compose.yml b/docker-compose.yml index 3eb2c43..1e910a8 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -1,20 +1,20 @@ +# docker-compose.yml (development) version: '3.8' - services: frontend: build: context: ./ReactTool/frontend + args: + - NODE_ENV=development ports: - "3000:3000" volumes: - ./ReactTool/frontend:/app - /app/node_modules environment: - - REACT_APP_BACKEND_URL=http://localhost:8000 + - NODE_ENV=development depends_on: - backend - networks: - - app-network backend: build: @@ -23,14 +23,6 @@ services: - "8000:5000" volumes: - ./ReactTool/backend:/app - - ./data/surveys/quiz:/app/surveys/quiz + - ./data/db:/app/data environment: - - FLASK_APP=app.py - FLASK_ENV=development - - PYTHONUNBUFFERED=1 - networks: - - app-network - -networks: - app-network: - driver: bridge \ No newline at end of file