Урок #4 - Шаблонизатор Jinja и HTML шаблоны
Видеоурок
Шаблонизатор Jinja
С давних пор программисты стараются отделить функциональную часть сайта от визуальной. Для решения этой проблемы были созданы различные шаблонизаторы, что выполняют роль отделения логической части сайта от визуальной. В фреймворке Джанго таким шаблонизатором является
Возможности шаблонизатора Jinja большие. Он способен выводить стандартную HTML разметку, а также выполнять: проверку условий, вывод массивов через цикл, вывод переменных и многое другое.
Ранее для вывода информации мы использовали HttpResponse. Подобный подход неверный, так как выводить «море» HTML тегов в формате одной строки – просто ужасно. Вместо такого подхода мы будем использовать функцию render
, что позволяет выводить большие HTML-шаблоны, напичканые кодом из шаблонизатора Jinja.
В качестве параметров при вызове HTML шаблона необходимо передать обязательный параметр request
, а также месторасположение файла с шаблоном.
Создание шаблона
Все шаблоны хранятся в одной общей папке templates. Django автоматически объединяет все папки templates в одну общую. Из-за такого свойства у вас могут возникать проблемы с одинаковыми именами файлов, поэтому чтобы избежать одинаковых имен стоит помещать все шаблоны в ещё одну дополнительную папку с именем вашего приложения: «home/templates/home/shablon.html».
В основном шаблоне можно прописать базовую структуру для всех HTML файлов:
<body>
{% block content %}
{% endblock %}
</body>
Внутрь базового шаблона можно встроить HTML блоки и заменить содержимое block content
. Чтобы это сделать создаем новый HTML файл и прописываем наследование структуры из базового файла:
{% extends "ПУТЬ К HTML ФАЙЛУ" %}
{% block content %}
<div>Здесь код, который будет добавлен</div>
{% endblock %}
Мы можем создавать небольшие кусочки кода и встраивать их в другие шаблоны. Для таких кусочков лучше создавать отдельную папку с названием includes
. В папке можно создать простой HTML файл с небольшой Jinja разметкой:
{% block content %}
<div>Здесь код, который будет добавлен</div>
{% endblock %}
{% include "ПУТЬ К ФАЙЛУ" %}
Материалы для курса
Чтобы скачивать материалы к видеокурсам необходимо оформить подписку на сайт
Исходный код
Весь код будет доступен после подписки на проект!
Задание к уроку
Необходимо оформить подписку на проект, чтобы получить доступ ко всем домашним заданиям
Большое задание по курсу
Вам необходимо оформить подписку на сайте, чтобы иметь доступ ко всем большим заданиям. В задание входит методика решения, а также готовый проект с ответом к заданию.
PS: подобные задания доступны при подписке от 1 месяца
Также стоит посмотреть