In this tutorial, we will explore the basics of web development using Flask and Jinja2. Flask is a lightweight and flexible web framework for Python that provides features for building web applications quickly and easily. Jinja2 is a templating engine for Python that allows you to create dynamic HTML templates for your web applications.
Before we get started, make sure you have Python installed on your computer. You can download Python from the official website (https://www.python.org/downloads/) if you don’t have it already. Once you have Python installed, you can install Flask by running the following command in your terminal:
pip install FlaskNow that we have Flask installed, let’s create a simple web application using Flask and Jinja2. Create a new Python file called app.py and open it in your favorite text editor. In app.py, we will write the following code to create a basic Flask application:
from flask import Flask, render_template
app = Flask(__name__)
@app.route('/')
def index():
return render_template('index.html')
if __name__ == '__main__':
app.run(debug=True)In this code, we import the Flask class from the flask module and create a new instance of the Flask class called app. We then use the @app.route() decorator to define a route for our application. In this case, we define a route for the root URL (‘/’) that will render the index.html template. Finally, we use the app.run() method to run the Flask application in debug mode.
Next, create a new folder called templates in the same directory as app.py. In the templates folder, create a new HTML file called index.html and open it in your text editor. In index.html, we will write a simple HTML template using Jinja2 syntax:
<!DOCTYPE html>
<html>
<head>
<title>Flask + Jinja2 Tutorial</title>
</head>
<body>
<h1>Welcome to Flask!</h1>
<p>Hello, {{ name }}!</p>
</body>
</html>In this HTML template, we use Jinja2 syntax to insert dynamic content into the template. The {{ name }} syntax is a placeholder that will be replaced with the value of the name variable when the template is rendered.
Now that we have our Flask application and Jinja2 template set up, we can run our application by executing the following command in your terminal:
python app.pyOnce the Flask application is running, open a web browser and navigate to http://127.0.0.1:5000 to see your web application in action. You should see the text "Welcome to Flask!" displayed on the page, followed by the text "Hello, !" with an empty placeholder for the name variable.
To pass a dynamic value to the name variable in our template, we can modify the index() function in app.py to include a parameter for the name variable:
@app.route('/')
def index():
name = 'John'
return render_template('index.html', name=name)Now, when you refresh the page in your web browser, you should see the text "Hello, John!" displayed on the page, with the name variable dynamically populated from the index() function in app.py.
Congratulations! You have successfully created a web application using Flask and Jinja2. This is just a simple example to get you started, but there are many more features and capabilities that you can explore with Flask and Jinja2 for building dynamic and interactive web applications. Happy coding!
wenn ich in vscode "!" eintippe um html boilerplate-code zu erzeugen, öffnet sich ganz oben wo die menüzeile ist, in der mitte eine art suchtextzeile, wo steht "select a codesnippet"… und "!"-zeichen kann ich erst gar nicht im vscode ein geben. es öffnet sich immer sofort diese zeile da oben. dort kann ich zwar dann auch html auswählen, der code ist dann etwas kürzer (die viewport-zeile fehlt, sonst gebe ich html:5 ein für den code) und vor allem ich kann generell kein "!"-zeichen eingeben.
ich habe auch schon zig male gegoogelt aber leider nichts brauchbares gefunden. hast du vllt eine idee wie ich mein ausrufezeichen "normaliesieren" kann?!?
wäre dir mega dankbar.
lg
Danke für das Video. Schönes Tutorial zu Flask und Jinja! Hatte mich schon gewundert was das form Attribut im Formular macht. 🙂
Staune auch, dass du in einem Flask Projekt von PyCharm auf VS Code gewechselt bist. Wegen Jinja und dem HTML?
Präferiert ihr Django oder Flask?