Hvordan lage dynamiske nettsider med Jinja-mal i FastAPI

Jinja-maler tilbyr et kraftig språk du kan bruke til å lage dynamiske nettsider med letthet.

Ved å integrere Jinja med FastAPI kan du lage dynamiske nettsider som sømløst blander Python kode med HTML, slik at du kan skille presentasjonslaget til applikasjonen din fra logikken lag. Med dynamiske nettsider kan du generere personlig tilpasset og datadrevet innhold, noe som forbedrer brukeropplevelsen.

Hva er Jinja?

Jinja er en robust, funksjonsrik malmotor for Python som genererer dynamiske nettsider. Jinja Templating støtter arv, betingede utsagn, looper og ulike funksjoner som forenkler opprettelsen av dynamiske nettsider.

Du kan kombinere FastAPI og Jinja for å lage nettsider med en konsistent layout som kan vise sanntidsdata og håndtere brukerinndata. Du kan også oppnå separasjon av bekymringer, noe som gjør koden din mer vedlikeholdbar og enklere å forstå.

Sett opp et FastAPI-prosjekt

For å komme i gang må du sette opp et FastAPI-prosjekt.

Opprett og aktiver et virtuelt miljø ved å bruke disse terminalkommandoene:
instagram viewer
```
python -m venv env# På Unix/MacOS: 
kilde venv/bin/activate# På Windows:
.\venv\Scripts\aktiver
```
Installer FastAPI og de nødvendige avhengighetene.
```
pip installer "fastapi[all]"
```
Opprett en prosjektkatalog min blogg.
Lag en Python-fil main.py i prosjektkatalogen din.

Legg til følgende kode til main.py fil:

fra fastapi import FastAPIfake_posts_db = [{
'tittel': 'Første blogginnlegg',
'innhold': 'Innholdet i det første blogginnlegget.',
'forfatter': 'John Doe',
'publiseringsdato': '2023-06-20',
'kommentarer': [
 {'forfatter': 'Alice', 'innhold': "Flott innlegg!"},
 {'forfatter': 'Bob', 'innhold': "Interessant lesning."}
 ],
'status': 'publisert'
},{
'tittel': 'Andre blogginnlegg',
'innhold': 'Innhold i det andre blogginnlegget.',
'forfatter': "Jane Smith",
'publiseringsdato': Ingen,
'kommentarer': [],
'status': "utkast"
}]
app = FastAPI()@app.get("/about")
defOm():
komme tilbake"Alt du trenger å vite om Simple Blog"

Koden ovenfor oppretter en enkel FastAPI-applikasjon med et enkelt endepunkt som returnerer et JSON-svar når det åpnes via den tilsvarende URL-en. Du kan bruk en Python-ordbok som dette i stedet for en faktisk database; det bidrar til å redusere kompleksiteten mens du fokuserer på hovedmålet.

Kjør serveren.
```
uvicorn main: app --last på nytt
```

Besøk http://localhost: 8000/ca i nettleseren din for å se serversvaret.

Integrering av Jinja-maler

Etter å ha satt opp prosjektet ditt, kan du nå legge til Jinja-maler til det.

I main.py fil, importerer du følgende moduler:

fra fastapi.templating import Jinja2-maler
fra fastapi.staticfiles import Statiske filer

Under app variabel, opprette en forekomst av Jinja2-maler klasse og send katalogen som vil inneholde malene dine.
```
maler = Jinja2Templates (katalog="maler")
```
Etter maler variabel, legg til følgende kodelinje:
```
app.mount("/statisk", StaticFiles (katalog="statisk"), navn="statisk")
```
Koden ovenfor monterer statisk katalogen og instruerer FastAPI til å vise statiske filer i katalogen når en forespørsels-URL begynner med /static.
I min blogg katalog opprette to kataloger, maler å holde HTML-filer og statisk som vil inneholde alle statiske filer.

Når disse trinnene er fullført, har du vellykket integrert Jinja Templating med prosjektet ditt.

Opprette dynamisk nettside med Jinja

Jinja gir et rikt sett med syntaks og funksjoner for å lage dynamiske maler.

I denne delen vil du se hvordan du bruker Jinja-malsyntaks for å lage dynamiske nettsider.

Legg ved maletiketter med en krøllete tannregulering og prosent symbol på begge sider. Du kan bruke slike tagger til å utføre kontrollflyt og logikkoperasjoner i malen. Noen vanlige maltagger inkluderer:

Betingelse: Kjører kodeblokken hvis betingelsen er sann.
```
{% hvis tilstand %}...{% endif %}
```
Løkke: Itererer over en iterabel og kjører kodeblokken for hvert element.
```
{% til punkt i iterable %}...{% endfor %}
```
Inkludere: Inkluderer en annen mal i gjeldende mal.
```
{% inkluderer 'mal_name.html' %}
```
Blokkere: Definerer en blokk som underordnede maler kan overstyre ved bruk av arv.
```
{% block block_name %}...{% endblock %}
```
Forlenge: Lar den underordnede malen arve og utvide den overordnede malen.
```
{% extend parent_temp.html %}
```

Disse kodene gir en fleksibel og uttrykksfull måte å generere HTML-innhold basert på dynamiske data og kontrollere logikken til applikasjonen din.

Mal Arv

Jinja Templating støtter malarv. Dette lar deg definere en grunnmal (overordnet) med en felles layout og seksjoner som en underordnet mal kan utvide eller overstyre. En barnemal kan bruke Forlenge tag for å arve og utvide den overordnede malen.

Lage en base.html fil i maler katalog med følgende kode.

html>
<html>
<hode>
<tittel>{% block title %}Enkel blogg{% endblock %}tittel>
hode>
<kropp>
<h1>{% block heading %}Enkel blogg{% endblock %}h1> {% blokker innhold %}
 {% sluttblokk %} {% include "footer.html" %}
kropp>
html>

På denne måten har du en overordnet mal som inneholder den felles koden for alle malene dine, slik at den underordnede malen kan arve og utvide den etter behov.

I maler katalog opprette en bunntekst.html fil med følgende kode.

<bunntekst>
<s>© 2023 Enkel blogg. Alle rettigheter forbeholdt.s>
<enhref="{{ url_for('about') }}">Omen>
bunntekst>

bunntekst.html er en inkludert mal som inneholder HTML-koden for bunntekstdelen. Du kan gjenbruke den på flere sider ved å inkludere den i basismalen ved å bruke Inkludere stikkord.

I maler katalog opprette en blog.html fil med følgende kode.

{% utvider "base.html" %}{% block title %}Enkel blogg – Bloggside{% endblock %}
{% block heading %}Enkel blogg – Bloggside{% endblock %}
{% blokker innhold %}
<h2>Totalt antall innlegg: {{ innlegg|lengde }}h2>
 {% for innlegg i innlegg %}
<divklasse="post">
 {% if post.status == 'publisert' %}
<h3>{{ post.title }}h3>
<s>{{ post.content|truncate }}s>
<s>Publisert den: {{ post.publication_date }}s>
<h4>Kommentarer:h4>
<ul>
 {% for kommentar i post.comments %}
<liklasse="kommentar">{{ comment.author }}-: {{ comment.content }}li>
 {% endfor %}
ul>
 {% annet %}
<s>Dette innlegget er fortsatt i utkastmodus.s>
 {% slutt om %}
div>
<hr>
 {% endfor %}
{% sluttblokk %}

Denne underordnede malen arver fra base.html bruker Forlenge stikkord. Den overstyrer spesifikke blokker definert i basismalen for å gi tilpasset innhold for bloggsiden. Det inkluderer også nødvendig logikk og iterasjon for å vise et innlegg og tilhørende kommentarer.

Uttrykkene

Jinja støtter et bredt spekter av uttrykk, inkludert aritmetiske operasjoner, sammenligninger og logiske operasjoner. For eksempel:

{{2 + 2}} // utgang: 4

Variabel substitusjon

For å skrive ut variabler i malen, omslutt dem i doble krøllete klammeparenteser. For eksempel:

{{post.title}} // output: 'Første blogginnlegg'

Filtre

Filtre endrer utdataene til en variabel. Du kan legge til en etter en variabel ved å bruke rørsymbolet (|). For eksempel:

{{post|length}} // output: 2

Du kan legge til innebygde kommentarer og flerlinjekommentarer i malene dine. Jinja vil ignorere disse kommentarene under malgjengivelsen, så de er nyttige for å legge til forklaringer i en mal.

{# #} // på linje{% kommentar %}... {% end comment %} // multiline

URL-er

For å tillate deg å generere korrekte hyperkoblinger til andre sider i applikasjonen, inkluderer Jinja-malkonteksten en url_for funksjon. For eksempel:

<enhref="{{ url_for('about') }}">Omen>

Koden ovenfor blir http://localhost: 8000/ca. Du vil også se hvordan du bruker url_for funksjon for å få statiske filstier senere.

Dette er bare noen av de grunnleggende aspektene ved Jinja Templating-syntaks. Jinja Templating gir mange flere funksjoner og funksjoner, som makroer, malkontekst og mer, for å gjøre maloppretting og tilpasning effektiv og fleksibel.

Sende data til maler

Nå som du har malene klare, må du overføre data fra FastAPI-endepunktene til malene for gjengivelse.

Legg til følgende kode til main.py fil:

fra fastapi import FastAPI, forespørsel
fra fastapi.responses import HTML-svar@app.get("/", response_class=HTMLResponse)
asynkrondeflese_innlegg(forespørsel: forespørsel):
komme tilbake maler. TemplateResponse("blog.html", {"be om": be om, 
"innlegg": falske_innlegg_db})

Koden definerer et FastAPI-endepunkt som håndterer en GET-forespørsel til rot-URLen ("/") og returnerer en HTML-svar generert fra blog.html mal. Den passerer en kontekstordbok som inneholder strømmen be om objekt og falske_innlegg_db, inn i malen. På denne måten kan Jinja gjengi nøyaktige og dynamiske data.

Besøk http://localhost: 8000/ i nettleseren din, og du bør se noe sånt som dette:

Du har sendt data til malene for gjengivelse.

Viser statiske filer

I tillegg til å gjengi dynamiske maler, gir FastAPI også funksjonalitet for visning av statiske filer som CSS-filer, JavaScript-filer og bilder.

Du vil bruke CSS for å forbedre utseendet og følelsen på siden.

I statisk katalog, opprette en styles.css fil med følgende kode.

kropp {
font-familie: Arial, sans serif;
margin: 0;
polstring: 20px;
bakgrunnsfarge: #f5f5f5;
}h1, h2, h3, h4 {
farge: #333;
}
.post {
bakgrunnsfarge: #fff;
polstring: 20px;
marg-bunn: 20px;
grense-radius: 5px;
boks-skygge: 0 2px 4pxrgba(0, 0, 0, 0.1);
}
.posth3 {
margin-topp: 0;
}
.posts {
marg-bunn: 10px;
}
.postul {
liste-stil-type: ingen;
polstring-venstre: 0;
}
.kommentar {
marg-bunn: 10px;
polstring: 10px;
bakgrunnsfarge: #f9f9f9;
grense-radius: 5px;
}bunntekst {
bakgrunnsfarge: #f2f2f2;
polstring: 10px;
tekstjustering: senter;
}

Endre hode element av base.html mal som følger:

<hode>
<tittel>{% block title %}Enkel blogg{% endblock %}tittel>
<linkhref="{{ url_for('static', path='/styles.css') }}"rel="stilark">
hode>

Funksjonen url_for() genererer en URL (bane) for styles.css (/static/styles.css) filen i statisk katalog som deretter serveres automatisk av FastAPI.

Besøk http://localhost: 8000/ på nettleseren din.

De samme prosedyrene gjelder for visning av bilde- og JavaScript-filer.

Husk å følge beste praksis

Når du arbeider med Jinja Templating i FastAPI, er det viktig å følge visse beste praksiser for å sikre en godt organisert og effektiv kodebase.

Organiser maler i en dedikert katalog og vurder å bruke underkataloger for relaterte maler.
Bruk malarv til å lage gjenbrukbare basismaler og utvide dem for spesifikt innhold.
Velg nøye dataene som skal overføres til maler, hold nyttelasten lav, og bruk kontekstprosessorer eller mellomvare for ofte brukte data.
Benytt Jinja Templating-funksjoner som makroer, filtre og kontrollstrukturer for forbedret kodegjenbrukbarhet og lesbarhet.
Optimaliser ytelsen ved å implementere bufringsstrategier for statiske maler, bruke HTTP-bufringshoder og profilering for flaskehalser i ytelse.

Ved å følge disse beste fremgangsmåtene kan du opprettholde et strukturert prosjekt, optimalisere gjengivelsesytelsen og effektivt utnytte funksjonene til Jinja Templating i FastAPI-applikasjonene dine.

Bruke FastAPI for å bygge RestAPIer

Bortsett fra å bygge applikasjoner som krever gjengivelse av maler. FastAPI utmerker seg med å bygge RestAPI-er på grunn av sin høye ytelse, brukervennlige syntaks, automatiske dokumentasjonsgenerering og skalerbarhet. Disse funksjonene gjør FastAPI ideell for effektiv utvikling av robuste web-APIer.

About Technology - denizatm.com