pushing the flask example

2 years ago · ee03f31efb
commit ee03f31efb
5 changed files with 91 additions and 0 deletions
--- a/README.md
+++ b/README.md
@ -0,0 +1,22 @@
+# Flask example
+
+This is a Flask example that you can use to make web applications.
+
+## Install
+
+You need to install Flask on your computer (or on the server you are working):
+
+`$ pip3 install flask`
+
+## Run the web application
+
+You can run the example application in different ways, here two examples:
+
+* `$ python3 app.py`
+* `$ flask --debug run`
+
+## Documentation
+
+* <https://flask.palletsprojects.com/en/2.2.x/>
+* <https://pzwiki.wdka.nl/mediadesign/Flask>
+
--- a/app.py
+++ b/app.py
@ -0,0 +1,39 @@
+from flask import Flask, redirect, url_for, request, render_template
+
+# Create the application.
+APP = Flask(__name__)
+
+# Define different routes of the application.
+@APP.route('/', methods=['GET', 'POST'])
+def index():
+
+	title = "Hello Flask"
+
+	# If something is submitted through the form...
+	# ref: https://pythonbasics.org/flask-http-methods/
+	if request.method == 'POST':
+
+		# Read the values from the form element.
+		name = request.form['name']
+		text = request.form['text']
+
+		# Write the submitted data to a file, which is
+		# in this case a "csv" (comma seperated values) file
+		# that you can also open with spreadsheet software.
+		# Note that the file is opened in the mode "a+"
+		# which means that the Flask application will append values
+		# (and not overwrite the csv file).
+		with open('database.csv', 'a+') as db:
+			db.write(f"{ name},{ text }\n")
+
+		msg = "Thanks!"
+		return render_template('index.html', title=title, msg=msg)
+	
+	# If the index page is loaded...
+	else:
+		msg = "Please submite the form below."
+		return render_template('index.html', title=title, msg=msg)
+
+if __name__ == '__main__':
+	APP.debug = True
+	APP.run(port = 5000)
--- a/static/main.css
+++ b/static/main.css
@ -0,0 +1,3 @@
+body{
+	background: lavender;
+}
--- a/templates/base.html
+++ b/templates/base.html
@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html lang='en'>
+<head>
+  <meta charset="utf-8" />
+  <title>{{ title }}</title>
+  <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='main.css') }}">
+</head>
+<body>
+  {% block content %}
+  {% endblock %}
+</body>
+</html>
--- a/templates/index.html
+++ b/templates/index.html
@ -0,0 +1,15 @@
+{% extends "base.html" %}
+
+{% block content %}
+<div id="index">
+	<h1>{{ title }}</h1>
+	<p>{{ msg }}</p>
+	<form action="/" method="POST">
+		<!-- You can use differen input type's in a form. -->
+		<!-- See: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input -->
+		<p><input type="text" name="name" placeholder="(name)" required/></p>
+		<p><textarea name="text" rows="5" cols="33" placeholder="(text)" required></textarea></p>
+		<p><input type="submit" value="submit" /></p>
+	</form>   
+</div>
+{% endblock %}