HTMX support :star-struck:

# http4k

[Philipp Mayer]

HTMX support 🤩

[dave]

just basic - yep. For the moment, it's just the Webjar and a few lenses for extracting the various headers, or to determine that requests are HTMX https://www.http4k.org/guide/reference/htmx/

[Mikael Ståldal]

Seems like htmxWebjar() is only useful if HTML is the only webjar you use, right? If you also use others (e.g. Hyperscript), then you have to use the old webJars() .

[dave]

Yes, for the moment the support is pretty basic but we thought we'd add the module so we have a place to put extra utilities as we discover them. There are a few custom lenses and the routers to distinguish htmx requests from standard. See below...

And as of the last release we also bundle the hyperscript webjar... 😉

val app = routes(
        htmxWebjars(),
        "/" bind GET to routes(
            // Respond to htmx powered requests
            Request.isHtmx bind { Response(OK).with(view of Time(Date())) },
            // Standard requests get routed to here
            orElse bind { Response(OK).with(view of Index) }
        )
    )

[Mikael Ståldal]

Ah, nice!

[Mikael Ståldal]

The Request.isHtmx is useful, using it in my example project now: https://github.com/mikaelstaldal/htmx-http4k-dsl

[dave]

We're under no illusions - HTMX doesn't really need much in the way of infrastructure. But having a bunch of tools that make life easier when using a particular tech with http4k is always our goal. 🙂

[Mikael Ståldal]

This gave me an idea, what about having this utility function in http4k-core (besides the webJars function):

import org.http4k.routing.ResourceLoader
import org.http4k.routing.static

fun webjar(name: String, version: String) =
    static(ResourceLoader.Classpath("/META-INF/resources/webjars/$name/$version/dist"))

Then you can use it like this:

htmxWebjars(),
        webjar("bootstrap", "5.3.0")

given these dependencies:

<dependency>
            <groupId>org.http4k</groupId>
            <artifactId>http4k-core</artifactId>
        </dependency>
        <dependency>
            <groupId>org.http4k</groupId>
            <artifactId>http4k-htmx</artifactId>
        </dependency>
        <dependency>
            <groupId>org.webjars.npm</groupId>
            <artifactId>bootstrap</artifactId>
            <version>5.3.0</version>
        </dependency>

[dave]

@Mikael Ståldal yeah - that would be a neat idea actually - and even better we could overload it with Pair<String, String> or a Map<String, String>.