# Django와 HTMX로 동적 웹 개발을 단순화하기 (4편) : payload는 어떻게?
기존 자바스크립트의 `fetch`를 이용한 Ajax 요청에서는 POST 요청을 보낼 때, 보통 `JSON.stringify()`를 이용해 페이로드(payload)를 직접 조립해서 보냅니다.
대략 이런 감각이죠.
```JavaScript
fetch("/api/todos/", {
method: "POST",
headers: {
"Content-Type": "application/json",
"X-CSRFToken": csrftoken
},
body: JSON.stringify({
title: "장보기",
done: false,
priority: 3
})
})
```
그렇다면 **[[HTMX]]**에서는 어떨까요? 도대체 `hx-post`는 데이터를 어떤 식으로 서버에 보내는 걸까요? 많은 예제가 아주 단순한 기능만 보여주다 보니, 복잡한 페이로드를 만들어 보내는 실전 예제를 찾기가 의외로 힘듭니다.
이번 포스트에서는 [[HTMX]]에서의 데이터 전송 방식과 서버에서 이를 처리하는 법을 완전히 정리해 보겠습니다.
------
## HTMX의 데이터 전송 방식 {#sec-1f930b1a0dad}
**`fetch`의 페이로드 감각과 `hx-post`의 데이터 전송 방식은 꽤 다릅니다.**
`fetch`에서는 개발자가 직접 객체를 만들고 JSON으로 변환해 바디(body)에 넣습니다. 반면 **HTMX는 기본적으로 DOM에 있는 값들을 수집해서 전송**합니다.
HTMX의 사고방식은 "JS 객체를 직접 조립하는 것"이 아니라, **"HTML 요소에서 값들을 모아 요청 파라미터를 만드는 것"**에 가깝습니다. 이를 위해 보통 다음 3가지 방식을 사용합니다.
### 1) Form 기반으로 값 모아서 보내기 {#sec-f5086851ac19}
가장 HTML답고 Django에도 잘 맞는 방식입니다.
```html
```
이 경우 HTMX는 폼 안의 입력값들을 수집해서 요청에 담아 보냅니다. 기본 인코딩은 일반 폼 제출과 같은 **URL-encoded form data** 방식입니다.
Django 뷰에서는 평소처럼 이렇게 받으면 됩니다.
```Python
def create_todo(request):
title = request.POST.get("title")
priority = request.POST.get("priority")
done = request.POST.get("done")
```
### 2) Form 없이 다른 요소의 값 포함하기: `hx-include` {#sec-a2c0e1f9e1ca}
버튼 하나에 `hx-post`를 달면서, 멀리 떨어져 있는 입력값만 골라 같이 보내고 싶을 때 사용합니다.
```HTML
```
`hx-include`는 지정한 요소들의 값을 요청에 포함시킵니다. 굳이 전체를 `