package html_of_jsx

  1. Overview
  2. Docs
Render HTML with JSX

Install 

dune-project
 Dependency

github.com Readme Changelog MIT License Edit opam file Versions (10)

Authors

  1. D
    David Sancho <dsnxmoreno@gmail.com>

Maintainers

  1. D
    David Sancho <dsnxmoreno@gmail.com>

Sources

html_of_jsx-0.1.0.tbz
sha256=a62b73fe66b6e40196cc06cc0771184d42923e9c571183ecc793cd58f0b407dd
sha512=b25ba1321a5413942bf781aa9a8cacdc92eb03c1099a4c564a061b32cc57bbae571465d123d98548aba1cc78c3bb79fbf415e29934a8318c15ab9ffc0ea8cceb

doc/dream.html

Integrate with Dream

Use html_of_jsx to render pages and fragments in a Dream web server.

Dune setup

(executable
 (name server)
 (libraries dream html_of_jsx)
 (preprocess (pps html_of_jsx.ppx)))

Rendering a page

Use JSX.render to produce an HTML string and return it with Dream.html:

let page = (~title, ~children, ()) => {
  <html lang="en">
    <head> <title> {JSX.string(title)} </title> </head>
    <body> {children} </body>
  </html>;
};

let () =
  Dream.run
  @@ Dream.router([
    Dream.get("/", _req =>
      Dream.html(JSX.render(
        <page title="Home">
          <h1> {JSX.string("Welcome")} </h1>
        </page>
      ))
    ),
  ]);
let page ~title ~children () =
  <html lang="en">
    <head><title>(JSX.string title)</title></head>
    <body>(children)</body>
  </html>

let () =
  Dream.run
  @@ Dream.router [
    Dream.get "/" (fun _req ->
      Dream.html (JSX.render (
        <page title="Home">
          <h1>(JSX.string "Welcome")</h1>
        </page>
      ))
    );
  ]

Streaming

For large pages, stream HTML chunks directly into the response body with JSX.render_streaming:

Dream.get("/stream", _req =>
  Dream.stream(~headers=[("Content-Type", "text/html")], stream => {
    JSX.render_streaming(
      chunk => Dream.write(stream, chunk),
      <page title="Streamed">
        <p> {JSX.string("This page is streamed")} </p>
      </page>,
    );
    Dream.close(stream);
  })
)
Dream.get "/stream" (fun _req ->
  Dream.stream ~headers:[("Content-Type", "text/html")] (fun stream ->
    JSX.render_streaming
      (fun chunk -> Dream.write stream chunk)
      (<page title="Streamed">
        <p>(JSX.string "This page is streamed")</p>
      </page>);
    Dream.close stream))