[ANN] heml, a HEEx-inspired HTML templating ppx for OCaml

Community
,
1

I’ve been working on heml, a PPX extension that allows you to build complex HTML templates directly in your OCaml code.

It’s a direct implementation of Elixir Phoenix’s HEEx templates.

The README on GitHub has an example video of what it looks like in the editor and a bunch of example code, but here’s a short snippet for convenience:

(* layouts.ml *)
let layout ~title contents = {%heml|<!DOCTYPE html>
<html lang="en">
  <head><title><%s= title %></title></head>
  <body>
    <%raw= contents %>
  </body>
</html>|}

(* main.ml *)
let heading ~text = {%heml|<h1><%s= text %></h1>|}

let greet ~user = {%heml|<p>Hello, <%s= user %></p>|}

let () =
  let title = "Hello, OCaml!" in
  print_endline {%heml|<Layouts.layout title={title}>
    <.heading text="Hello!" />

    <%= List.iter (fun user -> %>
      <.greet user={user} />
    <%= ) ["Steve"; "Becca"; "John"]; %>

</Layouts.layout>|}

heml differs from other templating solutions by allowing you to call OCaml code directly in the template, which is extremely useful for looping and conditional rendering. You can also create and call your own components/layouts.

heml leverages the OCaml LSP for accurate in-line errors, and the templates are parsed and compiled into a series of Buffer writes which returns a string at runtime.

I’m still waiting for it to be released on opam, but thought I’d share it in the meantime in case anyone would be willing to check it out and provide feedback :slight_smile: .

Thanks!

12 Likes