Tweet
Tweet

Slide 1

Slide 1 text

htmx is not a typo https://github.com/kimihito ϋοΧʔζνϟϯϓϧʔ2023 LT

Slide 2

Slide 2 text

ࣗݾ঺հ גࣜձࣾϛϊλέ ୅දऔక໾ ʢօ༷ͷ͓͔͛Ͱ10प೥ʣ ޷͖ͳ΋ͷ : Django, htmx ࠷ۙͷڵຯ : Elixir, Go ͍͍ͩͨ͜ͷΞΠίϯͰ͢

Slide 3

Slide 3 text

ຊτʔΫͷ໨ඪ htmxݕࡧͯ͠Ͷʂ

Slide 4

Slide 4 text

htmxͱ͸ https://htmx.org 14kbͷJavaScriptϥΠϒϥϦ ґଘͳ͠ ࡶͳઆ໌ : AjaxΛָʹ͢Δ΍ͭ

Slide 5

Slide 5 text

Thoughtworks Technology RadarʹࡌͬͨΑʂ

Slide 6

Slide 6 text

σϞ https://github.com/kimihito/hcmpl23-htmx-demo

Slide 7

Slide 7 text

No content

Slide 8

Slide 8 text

No content

Slide 9

Slide 9 text

No content

Slide 10

Slide 10 text

Hypermedia System

Slide 11

Slide 11 text

Hypermedia system αʔόʔͰHTMLΛੜ੒ͯ͠ϒϥ΢βͰϨϯμϦϯά͢ΔچདྷͷΞϓϦέʔγϣ ϯʢWeb 1.0ΞϓϦέʔγϣϯʣͷ΍ΓํͰ΋͍͍Μ͡Όͳ͍ Web 1.0ΞϓϦέʔγϣϯͰ͸ɺϢʔβ͕HTMLΛૢ࡞ʢHypermedia controlʣͰ ͖Δͷ͸ ͱ ͚ͩ htmx͸ ΍Ҏ֎Ͱ΋ϢʔβͷHypermedia controlΛ࣮ݱ͢Δ htmxͷػೳʢhx-boost΍hx-push-urlʣͰSPAͬΆ͍ͦΕͳΓͷUX͕ఏڙͰ͖Δ ࠷ۙͷJavaScriptϑϨʔϜϫʔΫ΁ͷΞϯνςʔθ

Slide 12

Slide 12 text

No content

Slide 13

Slide 13 text

ಋೖͷܦҢ

Slide 14

Slide 14 text

ಋೖͷܦҢ Django ΞϓϦέʔγϣϯʢMPAʣͷ։ൃΛҾ͖ड ͚Δ͜ͱʹͳΔʢશମͷ૊৫ࣗମ΋খ͘͞ɺ։ൃ ऀ͸΄΅ࢲ͚ͩʣ Ϣʔβʔͷར༻୺຤΍ωοτϫʔΫඇྗͳ৔߹͕ ଟ͍ͷͰɺJavaScriptଟ༻͸ආ͚͍ͨ HTMLΛ΍ΓͱΓ͢Δhtmxͷࢥ૝͕ັྗతͩͬͨ

Slide 15

Slide 15 text

࣮ઓ౤ೖͯ͠1೥΄Ͳͷײ૝

Slide 16

Slide 16 text

࣮ઓ౤ೖͯ͠1೥΄Ͳͷײ૝ ొ৔ਓ෺͕গͳ͍ͷͰγϯϓϧ HTMLΛݟΔ͚ͩͰ΍Γ͍ͨ͜ͱ͕Θ͔Δ ΫϥΠΞϯτͰ׬͍݁ͨ͠΋ͷ͸ Alpine.js Λ࢖͏ ඇৗʹୀ۶ʢॏཁʣˠ ࡞ΓํͰͳ͘࡞Δ΋ͷʹूத

Slide 17

Slide 17 text

୯७Ͱୀ۶ͳhtmx ੋඇτϥΠͯ͠΄͍͠Ͱ͢

Slide 18

Slide 18 text

htmx is not a typo