10 lutego 2023
Wprowadzenie do szablonów w Django
10 lutego 2023
W developmencie webowym szablony odgrywają kluczową rolę, ponieważ pomagają określić, jak informacje są wyświetlane i formatowane na stronie internetowej. Szablony Django nie są wyjątkiem. Stanowią integralną część Django, dostarczając potężne narzędzie do generowania dynamicznej zawartości HTML.
W swej istocie, szablony Django to pliki tekstowe, które definiują strukturę lub układ pliku (zazwyczaj pliku HTML), z zastępczymi miejscami dla rzeczywistej zawartości. Te zastępcze miejsca są zastępowane prawdziwą zawartością, gdy szablon jest renderowany, co jest procesem łączenia szablonu z określonym kontekstem (danymi), aby wyprodukować wyjście (kompletną stronę HTML gotową do wysłania do przeglądarki klienta).
Szablon Django jest napisany Django Template Language (DTL), który jest prostym, nieprogramistycznym językiem, którego może nauczyć się każdy projektant, który rozumie HTML. DTL umożliwia użycie prostej logiki w kodzie HTML, co może być niezwykle potężne do tworzenia skomplikowanych widoków.
Podsumowując, szablony Django są mostem między wyglądem twoich danych a tym, jak chcesz, aby były wyświetlane. Są nieodłączną częścią każdej aplikacji Django, a zrozumienie ich jest kluczem do opanowania Django.
Podstawowa składnia szablonów Django
Szablony Django są zaprojektowane tak, aby osoby znające HTML czuły się komfortowo i znajomo, ale mają swoją własną składnię, którą dyktuje język szablonów Django (DTL). Ten język wprowadza kilka specjalnych konstrukcji, głównie tagów i filtrów, umożliwiających szablonom obsługę logiki i manipulację danymi.
W DTL wyróżniamy trzy kluczowe elementy składni:
Zmienne: Zmienne są używane do wstawiania wartości z kontekstu do szablonu. Są otoczone podwójnymi nawiasami klamrowymi, takimi jak: {{ zmienna }}. Gdy szablon jest renderowany, {{ zmienna }} zostanie zastąpiona wartością zmiennej.
Tagi: Tagi zapewniają logikę w szablonie, pozwalając na wykonywanie pętli, warunków i innych. Tagi są otoczone przez {% and %}. Na przykład, {% if user.is_authenticated %} sprawdzi, czy aktualny użytkownik jest uwierzytelniony.
Filtry: Filtry pozwalają na modyfikację zmiennych do wyświetlania. Są oznaczane przez znak pipe |. Na przykład, {{ name|lower }} przekształci wartość name na małe litery.
Teraz spójrzmy na bardzo podstawowy przykład szablonu Django. Wyobraź sobie, że budujesz bloga i chcesz wyświetlić listę tytułów postów.
Zrozumienie tagów szablonów Django
Tagi szablonów są kluczową funkcją języka szablonów Django, pozwalając na implementację logiki bezpośrednio w twoich szablonach. Są otoczone przez {% i %}.
Przyjrzyjmy się niektórym z najpopularniejszych wbudowanych tagów szablonów Django:
{% for %} i {% endfor %}: Te tagi tworzą pętlę, która iteruje przez sekwencję. Na przykład, {% for post in posts %} będzie przechodzić przez każdy post w posts.
{% if %} i {% endif %}: Te tagi oceniają warunek i wyświetlają sekcję szablonu, jeśli warunek jest prawdziwy. Na przykład, {% if user.is_authenticated %} sprawdzi, czy użytkownik jest uwierzytelniony przed wyświetleniem następnej sekcji szablonu.
{% url 'viewname' %}: Ten tag jest używany do wyświetlania URL dla danego widoku. Jest to potężna funkcja, ponieważ pozwala uniknąć zakodowania na stałe URL-i w szablonach.
{% csrf_token %}: Ten tag jest używany do ochrony przed fałszywymi żądaniami między witrynami. Powinien być uwzględniony w każdym formularzu HTML w szablonach.
Zobaczmy te tagi w akcji w szablonie Django. Załóżmy, że tworzymy bloga i chcemy wyświetlić listę postów na blogu oraz formularz dla uwierzytelnionych użytkowników do tworzenia nowych postów.
<!DOCTYPE html>
<html lang="en">
<head>
<title>My Blog</title>
<!-- Bootstrap CSS -->
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<div class="container">
<h1>My Blog</h1>
<!-- Display the list of posts -->
<ul>
{% for post in posts %}
<li>{{ post.title }}</li>
{% empty %}
<li>No posts yet.</li>
{% endfor %}
</ul>
<!-- Display a form for authenticated users -->
{% if user.is_authenticated %}
<form action="{% url 'create_post' %}" method="POST">
{% csrf_token %}
<label for="title">Title:</label>
<input type="text" id="title" name="title">
<input type="submit" value="Create">
</form>
{% endif %}
</div>
</body>
</html>
W tym przykładzie używamy tagu {% for %} do iteracji przez każdy post w posts, tagu {% if %} do wyświetlania formularza tylko dla uwierzytelnionych użytkowników, tagu {% url %} do unikania zakodowania na stałe URL widoku 'create_post', oraz tagu {% csrf_token %} do ochrony formularza przed cross site forgery w naszej witrynie.
Tagi szablonu czynią szablony Django potężnymi i elastycznymi, umożliwiając budowanie złożonych i dynamicznych stron.
<!DOCTYPE html>
<html lang="en">
<head>
<title>Blog</title>
<!-- Bootstrap CSS -->
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<div class="container">
<h1>My Blog</h1>
<ul>
{% for post in posts %}
<li>{{ post.title }}</li>
{% empty %}
<li>No posts yet.</li>
{% endfor %}
</ul>
</div>
</body>
</html>
W tym przykładzie używamy tagu {% for %} do przechodzenia przez listę postów, a składnię {{ }} do wyjścia tytułu każdego postu. Używamy również tagu {% empty %} do wyświetlania komunikatu, jeśli lista postów jest pusta.
To jest tylko proste wprowadzenie do składni szablonów Django. Gdy zagłębimy się w tagi i filtry, zobaczysz, jak naprawdę potężny może być ten system.
Zaawansowane filtry szablonów w Django
W szablonach Django filtry są sposobem na transformację danych zmiennych. Są stosowane do zmiennych za pomocą znaku pipe (|), po którym następuje nazwa filtra i opcjonalnie parametr.
Oto niektóre powszechnie używane filtry w szablonach Django:
date: Formatuje datę zgodnie z danym formatem. Na przykład, {{ post.date|date:"F j, Y" }} wyświetliłby datę postu w formacie takim jak "1 stycznia 2023".
length: Zwraca długość listy. Na przykład, {{ posts|length }} zwróciłoby liczbę postów.
default: Zwraca domyślną wartość, jeśli zmienna jest fałszywa lub pusta. Na przykład, {{ name|default:"guest" }} zwróciłoby "guest", jeśli name nie jest podane.
lower: Konwertuje łańcuch na małe litery. Na przykład, {{ name|lower }} przekształciłoby wartość name na małe litery.
Zobaczmy te filtry w akcji w szablonie. Załóżmy, że nadal pracujemy nad naszym blogiem i chcemy wyświetlić listę postów na blogu z ich datami utworzenia, liczbą postów i domyślną nazwą dla użytkowników, którzy nie są zalogowani.
<!DOCTYPE html>
<html lang="en">
<head>
<title>My Blog</title>
<!-- Bootstrap CSS -->
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<div class="container">
<h1>Welcome, {{ user.name|default:"Guest" }}</h1>
<h2>You're viewing {{ posts|length }} posts.</h2>
<!-- Display the list of posts -->
<ul>
{% for post in posts %}
<li>
<h3>{{ post.title }}</h3>
<p>Posted on {{ post.date|date:"F j, Y" }}</p>
</li>
{% empty %}
<li>No posts yet.</li>
{% endfor %}
</ul>
</div>
</body>
</html>
W tym przykładzie używamy filtra default, aby wyświetlić "Guest", jeśli nie podano nazwy użytkownika, filtra length do policzenia liczby postów i filtra date do sformatowania daty posta.
Filtry szablonów Django oferują potężne narzędzie do manipulowania i wyświetlania danych, co sprawia, że twoje szablony są bardziej elastyczne i dynamiczne.
Podsumowanie i dobre praktyki
Przez ten post przeszliśmy przez wiele zagadnień, zagłębiając się w świat szablonów Django. Dowiedzieliśmy się, czym są szablony Django i jakie mają znaczenie w aplikacji Django, zrozumieliśmy podstawową składnię szablonów Django i poznaliśmy najczęściej używane tagi i filtry szablonów.
Oto krótkie podsumowanie:
1. Szablony Django to pliki tekstowe, zwykle napisane w HTML, które definiują strukturę strony internetowej. Pozwalają one generować dynamiczną zawartość sieciową, zastępując symbole zastępcze prawdziwymi danymi podczas renderowania szablonu.
2. W tych szablonach używany jest Django Template Language(DTL), wprowadzając zmienne, tagi i filtry, które pozwalają na logikę i manipulację danymi bezpośrednio w szablonie.
3. Tagi szablonów pozwalają wykonywać logikę w szablonach, taką jak pętle i warunki. Do najczęstszych tagów należą {% for %}, {% if %}, {% url %} i {% csrf_token %}.
4. Filtry szablonów pozwalają transformować dane zmiennych. Do najczęściej stosowanych filtrów należą date, length, default i lower.
Zanim zakończymy, omówmy kilka najlepszych praktyk przy pracy z szablonami Django:
Minimalizuj Logikę: Szablony są zaprojektowane do wyświetlania informacji, a nie do prowadzenia ciężkiej logiki. Jeżeli to możliwe, utrzymuj złożoną logikę w widokach i modelach, a nie w szablonach.
DRY (Don't Repeat Yourself): Django ma potężny system dziedziczenia szablonów, który pozwala na ponowne użycie części szablonów (takich jak nagłówki i stopki) na różnych stronach. Wykorzystaj go, aby uniknąć powtarzania.
Używaj {% url %}: Pomaga to utrzymać URL-e spójne i ułatwia ich aktualizację.
Opanowanie szablonów Django jest kluczowym krokiem do biegłości w Django. To szeroki temat, a jest jeszcze wiele do odkrycia, jak dziedziczenie szablonów i niestandardowe tagi i filtry szablonów. Nie zatrzymuj się tutaj - kontynuuj naukę, kontynuuj odkrywanie!
