# Django와 HTMX로 동적 웹 개발을 단순화하기 (3편): Django와 통합 "배터리 포함(Batteries Included)" 철학을 가진 든든한 백엔드 **[[Django]]**와, 그 백엔드가 갓 구워낸 따끈따끈한 HTML 조각을 영리하게 활용하는 **[[HTMX]]**는 그야말로 환상의 궁합을 자랑합니다. 이번 포스팅에서는 지난 시간에 이어 **Django와 HTMX로 동적 웹 개발을 단순화하기** 시리즈의 3편으로, 실제 Django 프로젝트에 HTMX를 통합하는 두 가지 구체적인 방법을 살펴보겠습니다. ![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:** 빌드 시스템을 사용 중이라면 `npm install htmx.org` 명령어로 설치할 수 있습니다. [HTMX 설치 공식 문서 바로가기](https://htmx.org/docs/#installing) ----- ## 2. django-htmx 패키지를 사용하는 방법 {#sec-e127afe305db} Django 생태계에는 [[HTMX]]를 더욱 "Django답게" 쓸 수 있도록 도와주는 전용 라이브러리가 존재합니다. 바로 **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. **미들웨어 추가** ```python MIDDLEWARE = [ ..., "django_htmx.middleware.HtmxMiddleware", ..., ] ``` ----- ### django-htmx는 얼마나 편리할까? {#sec-9b3f39c88466} [[HTMX]] 자체가 워낙 간단한 도구인데, 여기에 **django-htmx**라는 패키지까지 추가로 설치할 필요가 있을까? 라는 의구심이 드는 것도 사실입니다. 실제로 이 패키지 없이도 핵심 기능을 구현하는 데는 아무런 지장이 없으니까요. 하지만 이 패키지가 제공하는 편의 기능들을 살펴보면, 왜 많은 개발자가 이를 선택하는지 그 이유를 알 수 있습니다. **django-htmx**의 공식 문서에 따르면, 이 패키지의 가장 큰 특징은 **미들웨어를 통해 `request` 객체를 확장**해준다는 점입니다. 미들웨어를 등록하면 `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]]와 함께라면 [[JavaScript]]에서 벗어나 다시 HTML의 간결함으로 돌아오는 즐거움을 느끼실 수 있을 것입니다. **관련글 읽기** : - [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편): Payload 전송 방식](/ko/whitedec/2025/1/27/django-htmx-csrf-token-integration/) - [Django와 HTMX로 동적 웹 개발 단순화: Form과 Serializer 활용법](/ko/whitedec/2026/4/22/django-htmx-forms-serializer-usage/) - [Django와 HTMX로 동적 웹 개발을 단순화하기: Trigger 활용법](/ko/whitedec/2026/4/23/django-htmx-dynamic-web-development-trigger/)