</> htmx _{HTML을 위한 고성능 도구}

소개

htmx를 사용하면 속성들(attributes)을 사용하여 HTML에서 직접 AJAX, CSS Transitions, WebSockets 및 Server Sent Events를 사용할 수 있으므로 하이퍼텍스트의 강력함과 단순성으로 최신 사용자 인터페이스를 구축할 수 있습니다.

htmx은 작고 (~14k min.gz’d), 종속성이 없으며, 확장가능하며 & react에 비해 코드 베이스 크기를 67% 줄였습니다.

시작을 위한 동기부여

• 왜 <a>와 <form>만 HTTP 요청을 할 수 있나요?
• 왜 오직 click과 submit 이벤트만 트리거할 수 있나요?
• 왜 GET과 POST만 사용할 수 있나요?
• 왜 우리는 전체 화면만 교체할 수 있나요?

htmx는 이런 제멋대로인 제약 조건을 제거함으로써 HTML을 hypertext로 완성합니다.

빠른 시작

  <script src="https://unpkg.com/[email protected]"></script>
  <!-- AJAX를 통해 클릭으로 POST를 요청하는 버튼입니다 -->
  <button hx-post="/clicked" hx-swap="outerHTML">
    Click Me
  </button>

hx-post와 hx-swap 속성들은 htmx에게 알려줍니다:

“사용자가 이 버튼을 클릭하면 /clicked으로 AJAX 요청을 보내고 버튼 전체를 응답 컨텐츠로 바꿉니다.”

htmx는 intercooler.js의 후계 프로젝트입니다.

더 자세한 소개는 docs introduction를 읽어보세요.

NOTE: htmx 2.x에서는 IE 지원이 중단되었습니다.
IE 지원이 필요한 경우 1.x 코드줄을 사용하면 영구적으로 지원됩니다.

book

htmx를 사용하여 Hypermedia-Driven Applications을 구축하는 방법에 대한 책인 Hypermedia Systems의 출시를 발표하게 되어 기쁩니다:

sponsors

깃허브 스폰서를 통해 htmx 개발을 지원할 수 있습니다.

아낌없는 후원자 여러분께 감사드립니다: