- Building Web Applications with Flask
- Italo Maia
- 432字
- 2021-07-16 14:13:04
Serving HTML pages
First, to make our hello
function respond with HTML, all we have to do is change it like this:
def hello(): return "<html><head><title>Hi there!</title></head><body>Hello World!</body></html>", 200
In the preceding example, hello
is returning a HTML formatted string and a number. The string will be parsed as HTML by default while 200
is an optional HTTP code indicating a successful response. 200
is returned by default.
If you refresh your browser with F5, you'll notice that nothing has changed. That's why the Flask development server is not reloading when the source changes. That only happens when you run your application in debug mode. So let's do that:
app = Flask(__name__) app.debug=True
Now go to the terminal where your application is running, type Ctrl + C
then restart the server. You will notice a new output besides the URL where your server is running—something about "stat". That indicates your server will reload the code on source modification. That's nice, but did you spot the crime we just committed: defining our template inside the function that handles the response? Be careful, the MVC gods might be watching. Let's separate where we define our view from where we define our controller. Create a folder called templates and a file called index.html
inside it. The index.html
file content should be like this:
<html> <head><title>Hi there!</title></head> <body>Hello World!</body> </html>
Now change your code like this:
from flask import Flask, render_response @app.route("/") def hello(): return render_template("index.html")
Did you see what we did there? render_response
is capable of loading templates from the templates/
folder (a default for Flask) and you can render it just by returning the output.
Now let's add some JavaScript and CSS styles. By default, the Flask built-in development server serves all files in your project
folder that are in a subfolder called static
. Let's create ours and add some files to it. Your project tree should look like this:
project/ -main.py -templates/ --index.html -static/ --js ---jquery.min.js ---foundation.min.js ---modernizr.js --css ---styles.css ---foundation.min.css
Notice that I add files from the foundation.zurb
framework, a nice CSS framework available in http://foundation.zurb.com/. I advise you to do the same in order to have a modern, good-looking site. The path to the static files in your template should look like this:
<script src='/static/js/modernizr.js'></script>
The folder, /static
before the real file path is a route served by default by Flask that only works in debug mode. In production, you would have the HTTP server serving your static files for you. See the attached code for this chapter for the full example.
Try improving the hello world example with some nice CSS styling!
- Extending Jenkins
- iOS面試一戰到底
- 前端跨界開發指南:JavaScript工具庫原理解析與實戰
- Flink SQL與DataStream入門、進階與實戰
- PHP網絡編程學習筆記
- 前端架構:從入門到微前端
- 匯編語言程序設計(第3版)
- Building Minecraft Server Modifications
- 軟件測試教程
- PHP 7從零基礎到項目實戰
- Qt5 C++ GUI Programming Cookbook
- Python 3 數據分析與機器學習實戰
- JSP程序設計與案例實戰(慕課版)
- Simulation for Data Science with R
- ANSYS FLUENT 16.0超級學習手冊