HTMX
 | |
| Vývojář | Carson Gross |
|---|---|
| První vydání | květen 2020 |
| Aktuální verze | 1.9.11 (15.3. 2024) |
| Operační systém | multiplatformní software |
| Vyvíjeno v | JavaScript |
| Typ softwaru | knihovna |
| Licence | 0BSD |
| Web | htmx.org |
| Některá data mohou pocházet z datové položky. | |
Hypertext Markup Extensions zkráceně HTMX je knihovna, která umožňuje vývoj dynamických webových aplikací a rozšiřuje HTML o nové atributy. Tyto atributy umožňují deklarativní definování webové stránky přímo v HTML a CSS, bez potřeby explicitního psaní JavaScriptu.[1][2] Pomáhají nastavit, jak mají elementy reagovat na různé události, jako je například kliknutí na tlačítko nebo odeslání formuláře. Knihovna podporuje komunikaci se serverem s využitím standardních HTTP metod (GET, POST, PUT, DELETE atd.[3]) a umožňuje jednoduše vložit odpovědi serveru (obvykle text nebo HTML fragmenty) do určených částí webové stránky, aniž by bylo třeba ji celou překreslovat. Poskytuje přístup k funkcím AJAX, CSS Transitions a WebSockets. Knihovna je navržena tak aby byla kompatibilní s širokou škálou prohlížečů a zařízení.[4][1]
Historie a vývoj
[editovat | editovat zdroj]Knihovna HTMX je nástupce a rozšíření konceptů knihovny Intercooler.js, kterou vyvinul Carson Gross v roce 2013 [5]. Přinesla odpověď na rostoucí potřebu snadnějšího způsobu, jak integrovat interaktivní prvky do webových stránek. Zkombinovala možnosti moderních frameworků s jednoduchostí serverového zpracování tradičních webových aplikací.[6]
Použití
[editovat | editovat zdroj]HTMX přidává do HTML atributy k definici dynamického chování jako je spouštění serverových požadavků a aktualizování obsahu. Mezi tyto přidané atributy patří:[1]
| hx-trigger | Určuje druh události, který vyvolá odeslání dotazu na HTTP server |
| hx-request | Určuje parametry dotazu, který je odesílán na HTTP server |
| hx-target | Určuje konkrétní část stránky, která se má překreslit |
| hx-swap, hx-swap-oob | Určuje, jak se má překreslit část stránky přijetí odpovědi |
| hx-get, hx-post, hx-put, hx-delete, hx-patch: | Určuje, jakou HTTP metodu pro dotaz použít |
HTMX lze snadno integrovat do stávajícího projektu přidáním tohoto script tagu do hlavičky dokumentu:[4]
<script
src="https://unpkg.com/htmx.org@1.9.11"
integrity="sha384-0gxUXCCR8yv9FM2b+U3FDbsKthCI66oH5IA9fHppQq9DDMHuMauqq1ZHBpJxQ0J0"
crossorigin="anonymous">
</script
Další možností je instalace pomocí Npm nebo Yarn.[4]
Reference
[editovat | editovat zdroj]- ↑ a b c TIŠŇOVSKÝ, Pavel. HTMX: knihovna pro tvorbu stránek pomocí mírně rozšířeného HTML [online]. ROOT, 2022-11-24 [cit. 2024-04-04]. Dostupné online.
- ↑ NADKARNI, Tanvi. What is HTMX? [online]. Frontendeng, 2023-10-05 [cit. 2024-04-05]. Dostupné online.
- ↑ Introduction to HTMX [online]. Refine, 2023-10-26 [cit. 2024-04-04]. Dostupné online.
- ↑ a b c HTMX.org [online]. [cit. 2024-04-04]. Dostupné online.
- ↑ htmx 1.0.0 has been released [online]. HTMX, 2020-11-24 [cit. 2024-04-04]. Dostupné online.
- ↑ HIBBARD, James. An Introduction to htmx, the HTML-focused Dynamic UI Library [online]. SitePoint, 2023-08-08 [cit. 2024-04-04]. Dostupné online.