Jinja2 is een sjabloonmachine geschreven in pure Python. Het biedt een Django-geïnspireerde niet-XML syntaxis maar ondersteunt inline expressies en een optionele sandbox-omgeving. Het is klein maar snel, afgezien van een eenvoudig te gebruiken stand-alone template-engine. Flask is een op Python gebaseerd microweb-framework waarmee u uw webtoepassingen snel en efficiënt kunt schrijven.
In deze driedelige serie zal ik beginnen met de basisbeginselen van Jinja2 templating vanuit het perspectief van Flask. In de volgende delen van deze serie zal ik onderwerpen uit geavanceerde sjablonen behandelen terwijl ik leer hoe ik sjablonen in een op een kolf gebaseerde toepassing kan lay-out in een modulair en uitbreidbaar ontwerp.
Ik neem aan dat je een basiskennis hebt van de praktische tips voor het instellen van de Flask en de omgeving met behulp van virtualenv om te volgen tijdens het ontwikkelen van een Python-applicatie.
Flask wordt geleverd met Jinja2, en daarom hoeven we Flask alleen maar te installeren. Voor deze serie raad ik aan om de ontwikkelversie van Flask te gebruiken, die veel stabielere commandoregelondersteuning biedt naast vele andere functies en verbeteringen aan Flask in het algemeen.
pip install https://github.com/mitsuhiko/flask/tarball/master
In Flask kunnen we een complete webtoepassing schrijven zonder dat een sjabloon van een derde partij nodig is. Laten we een kijkje nemen naar een kleine Hallo Wereld
onderstaande app:
from flask import Flask app = Flask (__ name__) @ app.route ('/') @ app.route ('/ hello') @ app.route ('/ hallo /') def hello_world (user = None): user = user of' Shalabh 'return " Templating in Flask Hallo% s!
Welkom in de wereld van Flask!
"% user if __name__ == '__main__': app.run ()
Het is duidelijk dat het bovenstaande patroon van het schrijven van een applicatie niet haalbaar is in het geval van een echte webapplicatie waar HTML-, CSS- en JS-codebereiken in duizenden coderegels voorkomen. Hier bewaart sjabloneren ons omdat we onze weergavecode kunnen structureren door onze sjablonen gescheiden te houden. Flask biedt standaard ondersteuning voor Jinja2, maar elke andere templating-engine kan ook als geschikt worden gebruikt.
Flask verwacht standaard dat de sjablonen in een map met de naam worden geplaatst templates
op het hoofdniveau van de toepassing. Flask leest dan automatisch de inhoud door deze map beschikbaar te maken voor gebruik met de render_template ()
methode. Ik zal hetzelfde demonstreren door het triviale te herstructureren Hallo Wereld
toepassing hierboven weergegeven.
De applicatiestructuur zou zijn zoals hieronder getoond.
flask_app / mijn_app.py sjablonen / - index.html
from flask import Flask, render_template, request app = Flask (__ name__) @ app.route ('/') @ app.route ('/ hello') @ app.route ('/ hallo /') def hello_world (user = None): user = user of' Shalabh 'return render_template (' index.html ', user = user)
Templating in Flask Hallo user!
Welkom in de wereld van Flask!
Voer de volgende opdracht uit op de opdrachtregel om de toepassing uit te voeren:
flask - app = my_app uitvoeren
Open http://127.0.0.1.15.5000/ in een browser om de toepassing in actie te zien. Het resultaat zou hetzelfde zijn in het geval van http://127.0.0.1:5000/hello.
Probeer de URL met uw naam als laatste gedeelte ervan te openen. Dus als uw naam John is, is de URL http://127.0.0.1:5000/hello/John. Nu zou de pagina er als volgt uitzien:
Het is vrij eenvoudig dat in de methode Hallo Wereld
het laatste deel van de URL erna Hallo
wordt opgehaald uit het verzoek en doorgegeven aan de context van de sjabloon die wordt gebruikt met render_template ()
. Deze waarde wordt vervolgens geparseerd vanuit de sjablooncontext met behulp van de tijdelijke aanduiding Jinja2 user
. Deze tijdelijke aanduiding evalueert alle uitdrukkingen die erin worden geplaatst, afhankelijk van de sjablooncontext.
Gewoonlijk zal elke webapplicatie een aantal webpagina's hebben die van elkaar zullen verschillen. Codeblokken zoals kop- en voetteksten zijn op bijna alle pagina's van de site hetzelfde. Evenzo blijft het menu hetzelfde. In feite verandert gewoonlijk alleen het centrale containervak en blijft de rest meestal hetzelfde. Hiervoor biedt Jinja2 een geweldige manier van overerving tussen sjablonen. Het is een goede gewoonte om een basissjabloon te hebben waarin we de basislay-out van de site kunnen structureren, samen met de kop- en voettekst.
Ik zal een kleine applicatie maken om een lijst met producten onder verschillende categorieën te tonen. Voor het stylen zal ik het Bootstrap-framework gebruiken om een basisontwerp aan de sjablonen te geven. De applicatiestructuur is nu zoals hieronder getoond.
flask_app / mijn_app.py sjablonen / - base.html - home.html - product.html static / css / - bootstrap.min.css - main.css js / - bootstrap.min.js
Hier static / css / bootstrap.min.css
en static / js / bootstrap.min.js
kan worden gedownload van de hierboven genoemde bootstrap-website. De rest van de toepassingscode wordt hieronder gedemonstreerd.
from flask import Flask, render_template, abort app = Flask (__ name__) PRODUCTS = 'iphone': 'name': 'iPhone 5S', 'category': 'Phones', 'price': 699,, 'galaxy' : 'name': 'Samsung Galaxy 5', 'category': 'Phones', 'price': 649,, 'ipad-air': 'name': 'iPad Air', 'category': 'Tablets ',' prijs ': 649,,' ipad-mini ': ' naam ':' iPad Mini ',' categorie ':' Tablets ',' prijs ': 549 @ app.route (' / ') @ app.route ('/ home') def home (): return render_template ('home.html', products = PRODUCTS) @ app.route ('/ product /') def product (sleutel): product = PRODUCTS.get (sleutel) indien niet product: abort (404) return render_template (' product.html ', product = product)
In dit bestand heb ik de productlijst hard gecodeerd om de toepassing eenvoudiger te maken en me alleen te richten op het sjabloongedeelte. Ik heb twee eindpunten gemaakt, huis
en artikel
, wanneer de eerste bedoeld is om alle producten op te lijsten en de laatste de individuele pagina opent.
body padding-top: 50px; .top-pad opvulling: 40px 15px; text-align: center;
Dit bestand bevat een beetje aangepaste CSS die ik heb toegevoegd om de sjablonen leesbaarder te maken. Laten we nu naar de sjablonen kijken.
Jinja2 zelfstudie - Tutsplus % block container% % endblock%
Let op het gebruik van url_for ()
voor het maken van URL's voor statische bestanden en andere koppelingen. Het is een erg handige tool die wordt geleverd door Flask. Lees meer hierover in de documentatie. Een ander belangrijk punt om op te merken is het gebruik van % block container% % endblock%
, wat een zeer cruciale component is van Jinja2 om de templates modulair en erfelijk te maken. De volgende paar bestanden zullen dit duidelijker maken.
% breidt 'base.html'% % block container% uit% voor id, product in products.iteritems ()%% endblock%% endfor%productnaam'] $ product ['price']
Bekijk hoe deze sjabloon wordt uitgebreid base.html
en biedt de inhoud van % block container%
. % voor %
gedraagt zich net als een normale lus in elke taal die we hier gebruiken om een lijst met producten te maken.
% breidt 'home.html'% % block container% uit% endblock%productnaam'] product categorie']
$ product ['price']
De bovenstaande sjabloon implementeert de individuele productpagina.
Voer nu de app uit door de volgende opdracht uit te voeren.
flask - app = my_app uitvoeren
De actieve app lijkt op de app die wordt weergegeven in de onderstaande schermafbeelding. Open gewoon http://127.0.0.1:5000/home in de browser.
Klik op een van de producten om de individuele productpagina te bekijken.
In deze zelfstudie hebben we gezien hoe de sjabloonstructuur in een Flask-gebaseerde toepassing met Jinja2 is ingedeeld. We hebben ook gezien hoe blokken kunnen worden gebruikt om gebruik te maken van de overerving in sjablonen.
In het volgende deel van deze serie zullen we zien hoe een aangepast filter, een aangepaste contextprocessor en een macro kunnen worden geschreven.