Infra/Update Dockerfiles #59

Merged
cami merged 4 commits from infra/update-dockerfiles into main 2021-06-25 01:03:23 +00:00
5 changed files with 178 additions and 4 deletions

View file

@ -1,12 +1,13 @@
FROM python FROM python
WORKDIR /opt/demo/ WORKDIR /app
RUN apt-get -y update && apt-get -y upgrade
COPY requirements.txt . COPY requirements.txt .
RUN apt-get -y update && apt-get -y upgrade
RUN pip install -r requirements.txt RUN pip install -r requirements.txt
COPY /src . COPY /src .
CMD [ "python", "main.py" ] CMD [ "python", "app.py" ]

View file

@ -8,3 +8,15 @@ services:
dockerfile: Dockerfile.prod dockerfile: Dockerfile.prod
ports: ports:
- 8877:80 - 8877:80
backend-prod:
container_name: backend_bt
build:
context: ./backend
dockerfile: Dockerfile.prod
ports:
- 5000:5000
environment:
DEBUG: "no"
PORT: 5000
HOST: "0.0.0.0"

View file

@ -10,6 +10,7 @@ import Login from "./components/pages/Login";
import Register from "./components/pages/Register"; import Register from "./components/pages/Register";
import Manual from "./components/pages/Manual"; import Manual from "./components/pages/Manual";
import Secret from "./components/pages/Secret"; import Secret from "./components/pages/Secret";
import Umfrage from "./components/pages/Umfrage";
import PrivateRoute from "./auth/PrivateRoute"; import PrivateRoute from "./auth/PrivateRoute";
function App() { function App() {
@ -27,6 +28,7 @@ function App() {
<Route path="/manual" component={Manual} /> <Route path="/manual" component={Manual} />
<Route path="/ueber" component={Ueber} /> <Route path="/ueber" component={Ueber} />
<PrivateRoute path="/secret" component={Secret} /> <PrivateRoute path="/secret" component={Secret} />
<PrivateRoute path="/umfrage" component={Umfrage} />
</Switch> </Switch>
</Router> </Router>
</> </>

View file

@ -1,12 +1,15 @@
.input-field { .input-field {
width: auto; width: auto;
margin-bottom: 2em;
font-size: 1.5em;
} }
.input-field p { .input-field p {
font-size: 1.5em; font-size: 1.5em;
} }
.input-field input { .input-field input,
.input-field select {
width: 100%; width: 100%;
border-color: var(--primary); border-color: var(--primary);
background-color: var(--secondary); background-color: var(--secondary);
@ -27,3 +30,7 @@
.input-field input[type="submit"]:hover { .input-field input[type="submit"]:hover {
background-color: var(--primary-contr); background-color: var(--primary-contr);
} }
.input-field label {
font-size: 1.5em;
}

View file

@ -0,0 +1,152 @@
import React from "react";
import { useState } from "react/cjs/react.development";
import "../../App.css";
import "../Input.css";
import Footer from "../../Footer";
import InputField from "../InputField";
import SubmitField from "../SubmitField";
export default function Umfrage() {
const [age, setAge] = useState("");
const [gender, setGender] = useState("");
const [education, setEducation] = useState("");
const [skills, setSkills] = useState("");
const onSubmitClick = (e) => {
e.preventDefault();
let opts = {
age: age,
gender: gender,
education: education,
skills: skills,
};
console.log(opts);
/*fetch("/api/login", {
method: "post",
body: JSON.stringify(opts),
})
.then((r) => r.json())
.then((token) => {
if (token.access_token) {
login(token);
} else {
console.log("Please type in the correct username / password");
}
});
*/
};
const handleAgeChange = (e) => {
setAge(e.target.value);
};
const handleGenderChange = (e) => {
setGender(e.target.value);
};
const handleEducationChange = (e) => {
setEducation(e.target.value);
};
const handleSkillsChange = (e) => {
setSkills(e.target.value);
};
return (
<>
<div className="sitePage">
<h1> Umfrage</h1>
<p>
Damit ich etwas über die Studienteilnehmenden erfahre, möchte ich hier
eine kurze Erhebung einiger wichtiger Daten machen. Die Daten werden
natürlich nicht genauer verfolgt und die Auswertung der biometrischen
Verhaltensmerkmale geschieht unabhängig davon. Konkret bedeutet das,
dass ich deine Angaben nicht mit den Informationen aus den
Verhaltensmerkmalen zusammenfliessen lasse.
</p>
<p>
Die Umfrage dauert nur ca. 2 Minuten und nach der ersten Befragung
musst du diese auch nicht mehr ausfüllen, da ich dann eine ungefähre
Auswertung machen kann, wie sich die Studienteilnehmenden aufteilen.
So kann es für mich beispielsweise relevant sein, wenn sämtliche
Teilnehmenden ein sehr gutes Informatikverständnis haben.
</p>
<form id="umfrage" onClick={onSubmitClick}>
<InputField
InputType="number"
onChange={handleAgeChange}
LabelName="Wie alt bist du? (Alter in Jahren)"
/>
<div className="input-field">
<label htmlFor="gender">Welches Geschlecht hast du?</label> <br />
<select
name="gender"
id="gender"
onChange={handleGenderChange}
defaultValue="DEFAULT"
>
<option disabled value="DEFAULT">
-- Bitte wähle etwas aus --{" "}
</option>
<option value="male">Männlich</option>
<option value="female">Weiblich</option>
<option value="divers">divers</option>
<option value="sex_na">Keine Angabe</option>
</select>
</div>
<div className="input-field">
<label htmlFor="education">
Welches ist deine höchste abgeschlossene Ausbildung?
</label>
<br />
<select
name="education"
id="education"
onChange={handleEducationChange}
defaultValue="DEFAULT"
>
<option disabled value="DEFAULT">
-- Bitte wähle deine Ausbildung aus --
</option>
<option>Berufslehre</option>
<option>Gymnasiale Maturität</option>
<option>Berufsmatura</option>
<option>Bachelor</option>
<option>Master oder höher</option>
<option>Keine Angabe</option>
</select>
</div>
<div className="input-field">
<label htmlFor="itskills">
Wie schätzt du deine Kompetenzen im Bereich der Informatik als
Anwender ein?
</label>
<br />
<select
name="itskills"
id="itskills"
onChange={handleSkillsChange}
defaultValue="DEFAULT"
>
<option disabled value="DEFAULT">
-- Bitte wähle etwas aus --
</option>
<option>Sehr gut</option>
<option>Gut</option>
<option>Mittel</option>
<option>Eher nicht so gut</option>
<option>Gar nicht gut</option>
<option>Keine Angabe</option>
</select>
</div>
<SubmitField
InputName="Umfrage abschicken"
InputValue="Umfrage abschicken"
LabelName="Umfrage abschicken"
/>
</form>
</div>
<Footer />
</>
);
}