# Упрощение динамической веб-разработки с Django и HTMX (Часть 3): Интеграция с Django Надежный бэкэнд с философией "батарейки в комплекте" — **[[Django]]** — и **[[HTMX]]**, который ловко использует свежеиспеченные фрагменты HTML от этого бэкэнда, образуют поистине фантастический дуэт. В этом посте, продолжая серию **"Упрощение динамической веб-разработки с Django и HTMX"**, мы рассмотрим два конкретных метода интеграции HTMX в реальный проект Django. ![Изображение, демонстрирующее интеграцию Django и HTMX](/media/whitedec/blog_img/cd6a017531894572b0123aa2e403ef4b.webp) ----- ## 1. Прямое использование без сторонних пакетов {#sec-ca790606f6d7} Это самый чистый и легкий способ. Без сложной установки, просто добавив одну строку скрипта в HTML-шаблон, вы можете сразу же использовать функции HTMX. ### Метод установки {#sec-1b32901b18e3} Официальная документация HTMX предлагает несколько методов установки, но самый быстрый способ — это использование **CDN**. * **Использование CDN (самый быстрый):** Просто вставьте следующий код в тег `` вашего `base.html`. ```html ``` * **Прямая загрузка:** Если важна безопасность или работа в офлайн-среде, вы можете загрузить [htmx.min.js](https://www.google.com/search?q=https://unpkg.com/htmx.org/dist/htmx.min.js), поместить его в папку `static` вашего проекта и указать путь. * **npm:** Если вы используете систему сборки, вы можете установить HTMX с помощью команды `npm install htmx.org`. [Перейти к официальной документации по установке HTMX](https://htmx.org/docs/#installing) ----- ## 2. Использование пакета django-htmx {#sec-e127afe305db} В экосистеме Django существует специальная библиотека, которая помогает использовать [[HTMX]] "по-джанговски". Это **django-htmx**. ### Установка и настройка {#sec-1fad40addfc9} Следуйте инструкциям из [официальной документации django-htmx](https://django-htmx.readthedocs.io/en/latest/installation.html): 1. **Установка пакета** ```bash python -m pip install django-htmx ``` 2. **Регистрация в INSTALLED_APPS** ```python INSTALLED_APPS = [ ..., "django_htmx", ..., ] ``` 3. **Добавление промежуточного ПО (Middleware)** ```python MIDDLEWARE = [ ..., "django_htmx.middleware.HtmxMiddleware", ..., ] ``` ----- ### Насколько удобен django-htmx? {#sec-9b3f39c8466} [[HTMX]] сам по себе достаточно простой инструмент, так есть ли необходимость устанавливать дополнительный пакет **django-htmx**? Этот вопрос вполне закономерен, ведь основные функции можно реализовать и без него. Однако, если рассмотреть удобные функции, которые предоставляет этот пакет, становится понятно, почему многие разработчики выбирают его. Согласно официальной документации **django-htmx**, его главная особенность заключается в **расширении объекта `request` через промежуточное ПО (middleware)**. После регистрации middleware появляется атрибут `request.htmx`, через который можно легко получить доступ к таким деталям, как: * **Проверка информации о запросе:** `boosted`, `current_url`, `current_url_abs_path`, `history_restore_request`, `prompt` * **Управление целью и триггером:** `target`, `trigger`, `trigger_name`, `triggering_event` Кроме того, пакет поддерживает **два специальных тега**, которые упрощают работу с шаблонами: * `{% htmx_script %}`: Основной тег для вставки скрипта библиотеки HTMX. * `{% django_htmx_script %}`: Вспомогательный тег, который добавляет только расширенный скрипт для отладки, если HTMX был подключен через CDN или статически. Особенно впечатляет модуль `django_htmx.http`, который содержит **11 полезных методов**. Среди них выделяется `trigger_client_event()`. Он позволяет легко формировать заголовок `HX-Trigger` на стороне сервера и отправлять его вместе с ответом, тем самым **контролируя события клиента напрямую с сервера**. Это мощный инструмент, который становится очень часто используемым, как только вы к нему привыкнете. Конечно, все эти функции разработчик может реализовать самостоятельно, написав свое промежуточное ПО или вручную манипулируя заголовками. Поэтому, если вы, как и я, предпочитаете создавать все самостоятельно, этот пакет может не показаться вам обязательным. В заключение, **django-htmx** — это не "обязательный", а скорее **"пакет, который определенно делает разработку более комфортной"**. Объем официальной документации невелик, и его можно освоить за час-два, так что вы можете решить, стоит ли его внедрять, исходя из особенностей вашего проекта. ----- ## Завершение {#sec-2c0be77e7e31} Если вы планируете реализовать лишь несколько простых функций, таких как кнопка-переключатель или функция "лайк", то **прямого использования (CDN)** будет вполне достаточно. В конце концов, минимизация ненужных зависимостей может быть наиболее экономичной. Однако, если масштаб проекта увеличивается, и вам часто приходится одновременно обрабатывать как полные, так и частичные страницы в одном представлении, то стоит рассмотреть **django-htmx**. Какой подход вам больше по душе? На самом деле, django-htmx — не тяжелый пакет, он довольно легкий, поэтому, возможно, правильным решением будет просто установить его без лишних раздумий. Все зависит от настроения и характера разработчика. Я думаю, это определяется склонностью разработчика: "минимизировать зависимости" или "делать большинство вещей самостоятельно". Но какой бы выбор вы ни сделали, с [[HTMX]] вы сможете насладиться возвращением к простоте HTML, отойдя от [[JavaScript]]. **Читать по теме** : - [Упрощение динамической веб-разработки с Django и HTMX (Часть 1)](/ko/whitedec/2025/1/27/django-htmx-dynamic-web-simplification/) - [Упрощение динамической веб-разработки с Django и HTMX - Ajax (Часть 2)](/ko/whitedec/2025/1/27/django-htmx-dynamic-web-simplification-2/) - [Упрощение динамической веб-разработки с Django и HTMX (Часть 4)](/ko/whitedec/2025/1/27/django-htmx-csrf-token-integration/) - [Упрощение динамической веб-разработки с Django и HTMX (Часть 5)](/ko/whitedec/2025/1/27/django-htmx-advanced-features/) - [Упрощение динамической веб-разработки с Django и HTMX (Часть 6): Метод возврата HTML](/ko/whitedec/2025/1/27/django-htmx-html-response/) - [Упрощение динамической веб-разработки с Django и HTMX (Часть 7): Метод возврата JSON](/ko/whitedec/2025/1/27/django-htmx-json-response/)