Python Flask, a popular micro web framework, is widely used for building dynamic and responsive web applications. When integrated with HTML, it becomes a powerful combination for creating web applications and APIs. In this article, we will explore how to use Python Flask with HTML, covering key aspects and providing practical examples.
Flask and HTML are commonly paired because Flask serves the HTML templates, and HTML provides the structure and content for the webpages. Flask is written in Python, a high-level and interpreted language, ensuring flexibility and efficiency in web application development.
Setting Up a Flask Project with HTML
To begin working with Flask and HTML, first, ensure you have Python and pip installed. Then, install Flask using pip:
pip install flask
Creating the Project Structure
Create a new folder for your project and navigate into it. Inside this folder, create two more folders named 'templates' and 'static'. The 'templates' folder is where you'll place your HTML files, and the 'static' folder is for static files like CSS and JavaScript.
Setting the Application Configuration
Create a new file named 'app.py' in the project root folder and import the Flask class from the flask module. Initialize a Flask app and set its template folder:
from flask import Flask
app = Flask(__name__)
app.config['TEMPLATES_FOLDER'] = 'templates'
Writing Flask Routes and Rendering HTML
Flask routing maps URL endpoints to functions. To render HTML templates, use the render_template() method in your route functions. Import the abort() method for handling errors and request to help create URLFor() function.
Defining Routes and Rendering Templates
An example route ('/') is shown below. It renders the 'home.html' template located in the 'templates' folder:
from flask import Flask, render_template, abort
app = Flask(__name__)
app.config['TEMPLATES_FOLDER'] = 'templates'
@app.route('/')
def home():
return render_template('home.html')
if __name__ == '__main__':
app.run(debug=True)
Handling Routes and Errors
To handle route-specific errors, Flask's abort() function can be used. It accepts an HTTP status code as an argument, and a message as an optional argument:
from flask import Flask, render_template, abort
app = Flask(__name__)
app.config['TEMPLATES_FOLDER'] = 'templates'
@app.route('/nonexistent')
def non_existent_route():
abort(404, description="This route does not exist")
if __name__ == '__main__':
app.run(debug=True)
Passing Data to HTML Templates
Flask also allows passing data to your HTML templates. This data can be used within the template using special syntax, often denoted by {{ }} or {% %}.
Passing Variables to Templates
Use the render_template() method and add the data you want to pass as keyword arguments. In the following example, 'message' is passed to 'home.html':
@app.route('/')
def home():
message = 'Welcome to Flask with HTML!'
return render_template('home.html', message=message)
Using Variables in HTML Templates
In your HTML templates, use the double curled braces syntax to display the variables. The message variable passed from the Flask route is displayed within the 'h1' tag in the following 'home.html' example:
{{ message }}
With these basics, you're now equipped to start building dynamic web applications using Python Flask and HTML. Happy coding!