Șabloanele Jinja oferă un limbaj puternic pe care îl puteți folosi pentru a crea pagini web dinamice cu ușurință.

Integrarea Jinja cu FastAPI vă permite să creați pagini web dinamice care îmbină perfect Python cod cu HTML, permițându-vă să separați stratul de prezentare al aplicației dvs. de logică strat. Cu pagini web dinamice, puteți genera conținut personalizat și bazat pe date, îmbunătățind experiența utilizatorului.

Ce este Jinja?

Jinja este un motor de șablon robust, bogat în funcții pentru Python, care generează pagini web dinamice. Jinja Templating acceptă moștenirea, declarațiile condiționate, buclele și diverse caracteristici care simplifică crearea de pagini web dinamice.

Puteți combina FastAPI și Jinja pentru a crea pagini web cu un aspect consistent care poate afișa date în timp real și poate gestiona intrarea utilizatorului. De asemenea, puteți obține separarea preocupărilor, făcând codul mai ușor de întreținut și mai ușor de înțeles.

Configurați un proiect FastAPI

Pentru a începe, va trebui să configurați un proiect FastAPI.

instagram viewer
  1. Creați și activați un mediu virtual folosind aceste comenzi terminale:
    python -m venv env
    # Pe Unix/MacOS: 
    sursă venv/bin/activate
    # Pe Windows:
    .\venv\Scripts\activate
  2. Instalați FastAPI și dependențele necesare.
    pip install „fastapi[all]”
  3. Creați un director de proiect blogul meu.
  4. Creați un fișier Python principal.py în directorul dvs. de proiect.
  5. Adăugați următorul cod la principal.py fişier:
    din fastapi import FastAPI
    fake_posts_db = [{
    'titlu': „Prima postare pe blog”,
    'conţinut': „Conținutul primei postări pe blog”.,
    'autor': „John Doe”,
    'data publicării': '2023-06-20',
    'comentarii': [
     {'autor': "Alice", 'conţinut': „Foot post!},
     {'autor': „Bob”, 'conţinut': — Lectură interesantă.}
     ],
    'stare': 'publicat'
    },{
    'titlu': „A doua postare pe blog”,
    'conţinut': „Conținutul celei de-a doua postări pe blog”.,
    'autor': „Jane Smith”,
    'data publicării': Nici unul,
    'comentarii': [],
    'stare': 'proiect'
    }]
    

    aplicație = FastAPI()
    @app.get("/despre")
    defdespre():
    întoarcere„Tot ce trebuie să știi despre Simple Blog”
    Codul de mai sus creează o aplicație FastAPI simplă cu un singur punct final care returnează un răspuns JSON atunci când este accesat prin adresa URL corespunzătoare. Puteți utilizați un dicționar Python ca acesta în locul unei baze de date reale; ajută la reducerea complexității concentrându-se în același timp pe obiectivul principal.
  6. Rulați serverul.
    uvicorn main: app --reload

Vizita http://localhost: 8000/aproximativ în browser pentru a vedea răspunsul serverului.

Integrarea Jinja Templating

După ce ți-ai configurat cu succes proiectul, poți acum să-i adaugi un șablon Jinja.

  1. În principal.py fișier, importați următoarele module:
    din fastapi.template import Jinja2Templates
    din fastapi.staticfiles import StaticFiles
  2. Sub aplicația variabilă, creați o instanță a Jinja2Templates clasa și treceți directorul care va conține șabloanele dvs.
    șabloane = Jinja2Templates (director="șabloane")
  3. După șabloane variabilă, adăugați următoarea linie de cod:
    app.mount("/static", StaticFiles (director="static"), nume="static")
    Codul de mai sus montează static director și instruiește FastAPI să difuzeze orice fișiere statice aflate în director atunci când începe cu o adresă URL de solicitare /static.
  4. În blogul meu directorul creează două directoare, șabloane pentru a deține fișiere HTML și static care va conține toate fișierele statice.

Cu acești pași finalizați, ați integrat cu succes Jinja Templating în proiectul dvs.

Crearea unei pagini web dinamice cu Jinja

Jinja oferă un set bogat de sintaxă și caracteristici pentru a crea șabloane dinamice.

În această secțiune, veți vedea cum să utilizați sintaxa șablonului Jinja pentru a crea pagini web dinamice.

Anexați etichetele șablonului cu a bretele bucle și simbol procentual de ambele părți. Puteți utiliza astfel de etichete pentru a efectua operațiuni logice și flux de control în șablon. Unele etichete de șablon utilizate în mod obișnuit includ:

  • Condiție: rulează blocul de cod dacă condiția este adevărată.
    {% dacă condiție %}...{% endif %}
  • Buclă: Iterează peste un iterabil și rulează blocul de cod pentru fiecare articol.
    {% pentru articol în iterabil %}...{% endfor %}
  • Include: Include un alt șablon în șablonul curent.
    {% include „nume_șablon.html” %}
  • bloc: definește un bloc pe care șabloanele copil îl pot suprascrie folosind moștenirea.
    {% block block_name %}...{% endblock %}
  • Extinde: permite șablonului copil să moștenească și să extindă șablonul părinte.
    {% extend parent_temp.html %}

Aceste etichete oferă o modalitate flexibilă și expresivă de a genera conținut HTML bazat pe date dinamice și de a controla logica aplicației dvs.

Moștenirea șablonului

Jinja Templating acceptă moștenirea șablonului. Aceasta vă permite să definiți un șablon de bază (părinte) cu un aspect comun și secțiuni pe care un șablon copil le poate extinde sau înlocui. Un șablon copil poate folosi Extinde eticheta pentru a moșteni și a extinde șablonul părinte.

Creeaza o baza.html dosar în șabloane directorul cu următorul cod.

html>
<html>
<cap>
<titlu>{% block title %}Blog simplu{% endblock %}titlu>
cap>
<corp>
<h1>{% block heading %}Blog simplu{% endblock %}h1>
 {% block content %}
 {% endblock %}
 {% include „footer.html” %}
corp>
html>

În acest fel, aveți un șablon părinte care conține codul comun pentru toate șabloanele dvs., permițând șablonului copil să-l moștenească și să-l extindă după cum este necesar.

În șabloane director crea a footer.html fișier cu următorul cod.

<subsol>
<p>© 2023 Blog simplu. Toate drepturile rezervate.p>
<Ahref=„{{ url_for('despre') }}”>DespreA>
subsol>

footer.html este un șablon inclus care conține codul HTML pentru secțiunea de subsol. Îl puteți reutiliza pe mai multe pagini, incluzându-l în șablonul de bază folosind Include etichetă.

În șabloane director crea a blog.html fișier cu următorul cod.

{% extinde „base.html” %}
{% block title %}Blog simplu - Pagina de blog{% endblock %}


{% block heading %}Blog simplu - Pagina de blog{% endblock %}


{% block content %}
<h2>Numărul total de postări: {{ postări|lungime }}h2>


 {% pentru postări în postări %}
<divclasă="post">


 {% if post.status == „publicat” %}
<h3>{{ post.title }}h3>
<p>{{ post.content|trunchiați }}p>
<p>Publicat la: {{ post.publication_date }}p>


<h4>Comentarii:h4>
<ul>
 {% pentru comentariu în post.comments %}
<liclasă="cometariu">{{ comment.author }}-: {{ comment.content }}li>
 {% endfor %}
ul>
 {% altfel %}
<p>Această postare este încă în modul schiță.p>
 {% endif %}
div>
<HR>
 {% endfor %}
{% endblock %}

Acest șablon copil moștenește de la baza.html folosind Extinde etichetă. Acesta suprascrie anumite blocuri definite în șablonul de bază pentru a oferi conținut personalizat pentru pagina de blog. Include, de asemenea, logica și iterația necesară pentru afișarea unei postări și a comentariilor asociate.

Expresii

Jinja acceptă o gamă largă de expresii, inclusiv operații aritmetice, comparații și operații logice. De exemplu:

{{2 + 2}} // ieșire: 4

Înlocuire variabilă

Pentru a scoate variabile în șablon, includeți-le între acolade duble. De exemplu:

{{post.title}} // ieșire: „Prima postare pe blog”

Filtre

Filtrele modifică rezultatul unei variabile. Puteți adăuga una după o variabilă folosind simbolul conductei (|). De exemplu:

{{post|lungime}} // ieșire: 2

Puteți adăuga comentarii inline și comentarii pe mai multe linii în șabloanele dvs. Jinja va ignora aceste comentarii în timpul redării șablonului, deci sunt utile pentru adăugarea de explicații într-un șablon.

{# #} // în linie
{% cometariu %}... {% comentariu final %} // pe mai multe rânduri

URL-uri

Pentru a vă permite să generați hyperlinkuri corecte către alte pagini din cadrul aplicației, contextul șablonului Jinja include a url_for funcţie. De exemplu:

<Ahref=„{{ url_for('despre') }}”>DespreA>

Codul de mai sus devine http://localhost: 8000/aproximativ. Veți vedea, de asemenea, cum să utilizați url_for funcția pentru a obține căile statice ale fișierelor mai târziu.

Acestea sunt doar câteva dintre aspectele fundamentale ale sintaxei Jinja Templating. Jinja Templating oferă multe mai multe caracteristici și funcționalități, cum ar fi macrocomenzi, contextul șablonului și multe altele, pentru a face crearea și personalizarea șabloanelor eficiente și flexibile.

Transmiterea datelor la șabloane

Acum că aveți șabloanele pregătite, trebuie să treceți datele de la punctele finale FastAPI în șabloane pentru randare.

Adăugați următorul cod la principal.py fişier:

din fastapi import FastAPI, Solicitare
din fastapi.răspunsuri import HTMLResponse
@app.get("/", response_class=HTMLResponse)
asincrondefread_posts(cerere: cerere):
întoarcere șabloane. TemplateResponse(„blog.html”, {"cerere": cerere, 
"postări": fake_posts_db})

Codul definește un punct final FastAPI care gestionează o solicitare GET către adresa URL rădăcină ("/") și returnează un HTMLResponse generate din blog.html șablon. Trece un dicționar de context, care conține curentul obiect de cerere și fake_posts_db, în șablon. În acest fel, Jinja poate reda date precise și dinamice.

Vizita http://localhost: 8000/ pe browser și ar trebui să vedeți ceva de genul acesta:

Ați trecut cu succes date în șabloanele pentru randare.

Servirea fișierelor statice

Pe lângă redarea șabloanelor dinamice, FastAPI oferă și funcționalitate pentru difuzarea fișierelor statice, cum ar fi fișiere CSS, fișiere JavaScript și imagini.

Veți folosi CSS pentru a îmbunătăți aspectul paginii.

În static director, creați un stiluri.css fișier cu următorul cod.

corp {
familie de fonturi: Arial, sans-serif;
marginea: 0;
căptușeală: 20px;
culoare de fundal: #f5f5f5;
}
h1, h2, h3, h4 {
culoare: #333;
}


.post {
culoare de fundal: #fff;
căptușeală: 20px;
margine-fond: 20px;
hotar-raza: 5px;
cutie-umbră: 0 2px 4pxrgba(0, 0, 0, 0.1);
}


.posth3 {
margine-top: 0;
}


.postp {
margine-fond: 10px;
}


.postul {
tip-list-stil: nici unul;
padding-stânga: 0;
}


.cometariu {
margine-fond: 10px;
căptușeală: 10px;
culoare de fundal: #f9f9f9;
hotar-raza: 5px;
}
subsol {
culoare de fundal: #f2f2f2;
căptușeală: 10px;
aliniere text: centru;
}

Modificați cap element al baza.html șablon după cum urmează:

<cap>
<titlu>{% block title %}Blog simplu{% endblock %}titlu>
<legăturăhref=„{{ url_for('static', path='/styles.css') }}”rel="foaia de stil">
cap>

Funcția url_for() generează o adresă URL (cale) pentru stiluri.css (/static/styles.css) în fișierul static director care este apoi servit automat de FastAPI.

Vizita http://localhost: 8000/ pe browserul dvs.

Aceleași proceduri se aplică și pentru difuzarea fișierelor imagine și JavaScript.

Nu uitați să urmați cele mai bune practici

Când lucrați cu Jinja Templating în FastAPI, este important să urmați anumite bune practici pentru a asigura o bază de cod bine organizată și eficientă.

  • Organizați șabloanele într-un director dedicat și luați în considerare utilizarea subdirectoarelor pentru șabloane înrudite.
  • Utilizați moștenirea șabloanelor pentru a crea șabloane de bază reutilizabile și extindeți-le pentru un anumit conținut.
  • Selectați cu atenție datele pentru a le transmite șabloanelor, păstrând sarcina utilă ușoară și utilizați procesoare de context sau middleware pentru datele utilizate în mod obișnuit.
  • Folosiți funcțiile Jinja Templating, cum ar fi macrocomenzi, filtre și structuri de control, pentru a îmbunătăți reutilizarea și lizibilitatea codului.
  • Optimizați performanța prin implementarea strategiilor de stocare în cache pentru șabloanele statice, folosind antete de stocare în cache HTTP și profilare pentru blocajele de performanță.

Urmând aceste bune practici, puteți menține un proiect structurat, puteți optimiza performanța de randare și puteți utiliza eficient caracteristicile Jinja Templating în aplicațiile dvs. FastAPI.

Utilizarea FastAPI pentru construirea RestAPI

În afară de construirea de aplicații care necesită șabloane de randare. FastAPI excelează la construirea de RestAPI datorită performanței sale ridicate, sintaxei ușor de utilizat, generării automate a documentației și scalabilității. Aceste caracteristici fac FastAPI ideal pentru dezvoltarea eficientă a API-urilor web robuste.