Merge pull request 'Feature/Backendcontainer' (#35) from feature/backendContainer into main

Reviewed-on: #35
This commit is contained in:
cami 2021-06-21 23:01:15 +00:00
commit 838f673107
18 changed files with 234 additions and 29 deletions

View file

@ -1,19 +1,11 @@
# For more information, please refer to https://aka.ms/vscode-docker-python
FROM python:3.9
FROM python
EXPOSE 5000
WORKDIR /opt/
# Keeps Python from generating .pyc files in the container
ENV PYTHONDONTWRITEBYTECODE 1
COPY requirements.txt .
# Turns off buffering for easier container logging
ENV PYTHONUNBUFFERED 1
RUN pip install -r requirements.txt
# Install pip requirements
ADD requirements.txt .
RUN python -m pip install -r requirements.txt
WORKDIR /app
ADD . /app
COPY /src .
CMD ["flask", "run"]
CMD [ "python", "app.py" ]

19
backend/Dockerfile.bak Normal file
View file

@ -0,0 +1,19 @@
# For more information, please refer to https://aka.ms/vscode-docker-python
FROM python:3.9
#EXPOSE 5000
# Keeps Python from generating .pyc files in the container
#ENV PYTHONDONTWRITEBYTECODE 1
# Turns off buffering for easier container logging
# ENV PYTHONUNBUFFERED 1
# Install pip requirements
ADD requirements.txt .
RUN python -m pip install -r requirements.txt
WORKDIR /app
ADD . /app
CMD ["flask", "run"]

12
backend/Dockerfile.prod Normal file
View file

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

View file

@ -1,7 +1,11 @@
click==7.1.2
Flask==1.1.2
Flask-Login==0.5.0
Flask-SQLAlchemy==2.5.1
greenlet==1.1.0
itsdangerous==1.1.0
Jinja2==2.11.3
MarkupSafe==1.1.1
python-dotenv==0.17.1
SQLAlchemy==1.4.15
Werkzeug==1.0.1

View file

@ -1,8 +1,34 @@
import time
from flask import Flask
import os
app = Flask(__name__)
# Read environment variables
if "DEBUG" in os.environ and os.environ["DEBUG"] == 'yes':
debug = True
else:
debug = False
if "HOST" in os.environ:
host = os.environ["HOST"]
else:
host = '0.0.0.0'
if "PORT" in os.environ:
port = int(os.environ["PORT"])
else:
port = 5000
@app.route('/')
def home():
return "Hello World"
@app.route('/time')
def get_current_time():
return {'time': time.time()}
if __name__ == '__main__':
app.run(debug=debug, host=host, port=port)

View file

@ -24,5 +24,6 @@ services:
ports:
- 5000:5000
environment:
DEBUG: "yes"
PORT: 5000
FLASK_DEBUG: 1
HOST: "0.0.0.0"

30
frontend/issues.sh Normal file
View file

@ -0,0 +1,30 @@
# Labels: backend, bug, content, design, duplicate, enhancement, frontend, help wanted, invalid, question, wontfix,
ISSUE_TITLE="Buttons gleichmässig darstellen"
DESC="Die Buttons sollen alle die gleiche Breite haben"
LABELS="design,frontend,enhancement"
DEADLINE="2021-06-23"
tea issue create --title "${ISSUE_TITLE}" --description "${DESC}" --labels "${LABELS}" --deadline "${DEADLINE}"
ISSUE_TITLE="login backend implementieren"
DESC=""
LABELS="backend,enhancement"
DEADLINE="2021-06-25"
tea issue create --title "${ISSUE_TITLE}" --description "${DESC}" --labels "${LABELS}" --deadline "${DEADLINE}"
ISSUE_TITLE="registrieren implementieren backend"
DESC=""
LABELS="backend,enhancement"
DEADLINE="2021-06-25"
tea issue create --title "${ISSUE_TITLE}" --description "${DESC}" --labels "${LABELS}" --deadline "${DEADLINE}"
ISSUE_TITLE="Umfrage erstellen (für neue Teilnehmer)"
DESC=""
LABELS="frontend,enhancement,backend"
DEADLINE="2021-06-25"
tea issue create --title "${ISSUE_TITLE}" --description "${DESC}" --labels "${LABELS}" --deadline "${DEADLINE}"
ISSUE_TITLE="Datenerhebung der Maus und Tastatur"
DESC=""
LABELS="frontend,backend,enhancement"
DEADLINE="2021-06-27"
tea issue create --title "${ISSUE_TITLE}" --description "${DESC}" --labels "${LABELS}" --deadline "${DEADLINE}"

View file

@ -39,5 +39,5 @@
"last 1 safari version"
]
},
"proxy": "http://127.0.0.1:5000"
"proxy": "http://localhost:5000"
}

View file

@ -7,7 +7,7 @@
:root {
--primary: rgb(41, 63, 87);
--secondary: #fff;
--secondary: rgb(218,218,218);
--third: rgb(171, 183, 183);
}
@ -28,20 +28,24 @@
font-size: 100px;
}
.products {
background-image: url('images/img-9.jpg');
.sign-up {
background-image: url("images/img-9.jpg");
background-position: center;
background-size: fill;
background-size: cover;
background-repeat: no-repeat;
color: var(--primary);
font-size: 100px;
}
.sign-up {
background-image: url('images/img-9.jpg');
background-position: center;
background-size: cover;
background-repeat: no-repeat;
color: #fff;
font-size: 100px;
.sitePage {
height: 90vh;
display: flex;
flex-direction: column;
align-content: center;
align-items: center;
background-color: var(--secondary);
}
.sitePage h1 {
font-size: 80px;
margin: 0.7em auto;
}

View file

@ -7,6 +7,9 @@ import SignUp from "./components/pages/SignUp";
import Ueber from "./components/pages/Ueber";
import Lizenzen from "./components/pages/lizenzen";
import Privacy from "./components/pages/Privacy";
import Login from "./components/pages/Login";
import Register from "./components/pages/Register"
import Manual from "./components/pages/Manual";
function App() {
return (
@ -19,6 +22,9 @@ function App() {
<Route path="/sign-up" component={SignUp} />
<Route path="/lizenzen" component={Lizenzen} />
<Route path="/privacy" component={Privacy} />
<Route path="/login" component={Login} />
<Route path="/register" component={Register} />
<Route path="/manual" component={Manual} />
</Switch>
</Router>
</>

View file

@ -11,7 +11,7 @@ function Footer() {
<div className="footer-link-items">
<h2>Informationen</h2>
<Link to="/">Hintergrund</Link>
<Link to="/">Ziel dieser Webseite</Link>
<Link to="/manual">Wie funktioniert das?</Link>
</div>
<div className="footer-link-items">
<h2>Kontakt</h2>

View file

@ -0,0 +1,11 @@
.input-field {
width: auto;
}
.input-field p{
font-size: 36px;
}
.input-field input {
width: 100%;
border-color: var(--primary);
}

View file

@ -0,0 +1,13 @@
import React from "react";
import "./Input.css";
function InputField(props) {
return (
<label className="input-field">
<p>{props.LabelName}</p>
<input name={props.InputName} type={props.InputType} />
</label>
);
}
export default InputField;

View file

@ -146,7 +146,7 @@
background-color: transparent;
color: var(--primary);
padding: 14px 20px;
border: 1px solid #fff;
border: 1px solid var(--primary);
transition: all 0.3s ease-out;
}

View file

@ -0,0 +1,14 @@
import React from "react";
import "./Input.css"
import "./Button.css"
function SubmitField(props) {
const InputValue = props.LabelName;
return (
<label className="input-field" className="btn btn--primary btn--medium">
<input type="submit" value={InputValue} />
</label>
);
}
export default SubmitField;

View file

@ -0,0 +1,30 @@
import React from "react";
import "../../App.css";
import Footer from "../../Footer";
import InputField from "../InputField";
import SubmitField from "../SubmitField";
export default function Login() {
return (
<>
<div className="sitePage">
<h1>Login</h1>
<form>
<InputField
LabelName="Benutzername / Kennung"
InputType=""
InputName="username"
/>
<InputField
LabelName="Passwort"
InputType="password"
InputName="password"
/>
<br />
<SubmitField LabelName="Einloggen" />
</form>
</div>
<Footer />
</>
);
}

View file

@ -0,0 +1,12 @@
import React from "react";
import "../../App.css";
import Footer from "../../Footer";
export default function Manual() {
return (
<>
<h2 className="about">Anleitung / Bedienungshinweise</h2>
<Footer />
</>
);
}

View file

@ -0,0 +1,31 @@
import React from "react";
import "../../App.css";
import Footer from "../../Footer";
import InputField from "../InputField";
import SubmitField from "../SubmitField";
export default function Login() {
return (
<>
<div className="sitePage">
<h1>Registrierung</h1>
<p>Herzlich willkommen bei meiner Bachelorarbeit. Du kannst dich hier einfach registrieren, sodass du mir ein positives Feedback hinterlassen kannst. Bei der ersten Registrierung geht es darum, dass ich ein paar Sachen über dich kennenlerne. Ich werde diese Fragen strikt trennen mit der eigentlichen Fragestellung. Diese Fragen dienen mir dazu, dass ich einschätzen kann, welche Leute ich befragt habe.</p>
<form>
<InputField
LabelName="Benutzername / Kennung"
InputType=""
InputName="username"
/>
<InputField
LabelName="Passwort"
InputType="password"
InputName="password"
/>
<br />
<SubmitField LabelName="Einloggen" />
</form>
</div>
<Footer />
</>
);
}