{"id":13837970,"url":"https://github.com/yawaramin/dream-html","last_synced_at":"2025-04-04T12:07:59.222Z","repository":{"id":155563237,"uuid":"631108421","full_name":"yawaramin/dream-html","owner":"yawaramin","description":"Type-safe markup rendering, form validation, and routing for OCaml Dream web framework","archived":false,"fork":false,"pushed_at":"2025-02-26T23:00:09.000Z","size":968,"stargazers_count":176,"open_issues_count":3,"forks_count":16,"subscribers_count":4,"default_branch":"main","last_synced_at":"2025-03-28T11:08:42.789Z","etag":null,"topics":["html","htmx","mathml","ocaml","svg"],"latest_commit_sha":null,"homepage":"https://yawaramin.github.io/dream-html/","language":"OCaml","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"gpl-3.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/yawaramin.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGES.md","contributing":null,"funding":null,"license":"COPYING.txt","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2023-04-22T00:47:10.000Z","updated_at":"2025-03-24T01:00:29.000Z","dependencies_parsed_at":null,"dependency_job_id":"46103f13-9533-4810-a79d-5b3ad3c2e875","html_url":"https://github.com/yawaramin/dream-html","commit_stats":null,"previous_names":[],"tags_count":31,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yawaramin%2Fdream-html","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yawaramin%2Fdream-html/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yawaramin%2Fdream-html/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yawaramin%2Fdream-html/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/yawaramin","download_url":"https://codeload.github.com/yawaramin/dream-html/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247174418,"owners_count":20896078,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["html","htmx","mathml","ocaml","svg"],"created_at":"2024-08-04T15:01:32.105Z","updated_at":"2025-04-04T12:07:59.204Z","avatar_url":"https://github.com/yawaramin.png","language":"OCaml","funding_links":[],"categories":["OCaml","\u003ca name=\"OCaml\"\u003e\u003c/a\u003eOCaml"],"sub_categories":[],"readme":"\u003cp align=\"center\"\u003e\n  \u003ca href=\"https://yawaramin.github.io/dream-html/dream-html/Dream_html/\"\u003eAPI Reference\u003c/a\u003e\n\u003c/p\u003e\n\n## dream-html - build robust and maintainable OCaml Dream webapps\n\nCopyright 2023 Yawar Amin\n\nThis file is part of dream-html.\n\ndream-html is free software: you can redistribute it and/or modify it under\nthe terms of the GNU General Public License as published by the Free Software\nFoundation, either version 3 of the License, or (at your option) any later\nversion.\n\ndream-html is distributed in the hope that it will be useful, but WITHOUT\nANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS\nFOR A PARTICULAR PURPOSE. See the GNU General Public License for more details.\n\nYou should have received a copy of the GNU General Public License along with\ndream-html. If not, see \u003chttps://www.gnu.org/licenses/\u003e.\n\n## What\n\nThis project started as a simple HTML library; it has evolved into something more\nover time. Here are the highlights:\n\n- Closely integrated with the [Dream](https://aantron.github.io/dream/) web\n  framework for OCaml\n- Generate HTML using type-safe functions and values\n- MathML and SVG support\n- Support for htmx attributes\n- Type-safe HTML form and query decoding\n- Type-safe path parameter parsing and printing\n\n\u003e [!NOTE]\n\u003e If you're not using Dream, you can still use the HTML/SVG/MathML/htmx\n\u003e generation features using the `pure-html` package.\n\n## First look\n\n```ocaml\nlet%path greeting = \"/%s\"\n\nlet hello _request who =\n  let open Dream_html in\n  let open HTML in\n  respond (\n    html [lang \"en\"] [\n      head [] [\n        title [] \"dream-html first look\";\n      ];\n      body [] [\n        h1 [] [txt \"Hello, %s!\" who];\n        p [] [\n          txt \"This page is at: \";\n          a [path_attr href greeting who] [txt \"this URL\"];\n          txt \".\";\n        ];\n      ];\n    ]\n  )\n\nlet () =\n  Dream.run\n  @@ Dream.logger\n  @@ Dream.router [\n    Dream_html.get greeting hello;\n  ]\n```\n\n\u003cimg width=\"343\" alt=\"Browser window at the location localhost:8080/me with the page header 'Hello, me!' and the paragraph below with text 'This page is at: this URL.', where the words 'this URL' are underlined and the browser status bar shows the address 'localhost:8080/me'.\" src=\"https://github.com/user-attachments/assets/84cd1f1e-46c3-4fe1-aeb2-724542fc987c\"\u003e\n\nRendered HTML:\n\n```html\n\u003c!DOCTYPE html\u003e\n\u003chtml lang=\"en\"\u003e\n  \u003chead\u003e\n    \u003ctitle\u003edream-html first look\u003c/title\u003e\n  \u003c/head\u003e\n  \u003cbody\u003e\n    \u003ch1\u003eHello, me!\u003c/h1\u003e\n    \u003cp\u003eThis page is at: \u003ca href=\"/me\"\u003ethis URL\u003c/a\u003e.\u003c/p\u003e\n  \u003c/body\u003e\n\u003c/html\u003e\n```\n\n## Security (HTML escaping)\n\nAttribute and text values are escaped using rules very similar to standards-\ncompliant web browsers:\n\n```\nutop # open Dream_html;;\nutop # open HTML;;\n\nutop # let user_input = \"\u003cscript\u003ealert('You have been pwned')\u003c/script\u003e\";;\nval user_input : string = \"\u003cscript\u003ealert('You have been pwned')\u003c/script\u003e\"\n\nutop # p [] [txt \"%s\" user_input];;\n- : node = \u003cp\u003e\u0026lt;script\u0026gt;alert('You have been pwned')\u0026lt;/script\u0026gt;\u003c/p\u003e\n\nutop # div [title_ {|\"%s|} user_input] [];;\n- : node = \u003cdiv title=\"\u0026quot;\u003cscript\u003ealert('You have been pwned')\u003c/script\u003e\"\u003e\u003c/div\u003e\n```\n\n## How to install\n\nMake sure your local copy of the opam repository is up-to-date first:\n\n```\nopam update\nopam install dream-html # or pure-html if you don't want the Dream integration\n```\n\nAlternatively, to install the latest commit that may not have been released yet,\nyou have two options. If you need _only_ the HTML generation:\n\n```\nopam pin add pure-html git+https://github.com/yawaramin/dream-html\n```\n\nIf you _also_ need the Dream integration:\n\n```\nopam pin add pure-html git+https://github.com/yawaramin/dream-html\nopam pin add dream-html git+https://github.com/yawaramin/dream-html\n```\n\n## Usage\n\nA convenience is provided to respond with an HTML node from a handler:\n\n```ocaml\nDream_html.respond greeting\n```\n\nYou can compose multiple HTML nodes together into a single node without an extra\nDOM node, like [React fragments](https://react.dev/reference/react/Fragment):\n\n```ocaml\nlet view = null [p [] [txt \"Hello\"]; p [] [txt \"World\"]]\n```\n\nYou can do string interpolation of text nodes using `txt` and any attribute which\ntakes a string value:\n\n```ocaml\nlet greet name = p [id \"greet-%s\" name] [txt \"Hello, %s!\" name]\n```\n\nYou can conditionally render an attribute, and\n[void elements](https://developer.mozilla.org/en-US/docs/Glossary/Void_element)\nare statically enforced as childless:\n\n```ocaml\nlet entry =\n  input [\n    if should_focus then autofocus else null_;\n    id \"email\";\n    name \"email\";\n    value \"Email address\";\n  ]\n```\n\nYou can also embed HTML comments in the generated document:\n\n```ocaml\ndiv [] [comment \"TODO: xyz.\"; p [] [txt \"Hello!\"]]\n(* \u003cdiv\u003e\u003c!-- TODO: xyz. --\u003eHello!\u003c/div\u003e *)\n```\n\nYou have precise control over whitespace in the rendered HTML; dream-html does\nnot insert any whitespace by itself–all whitespace must be inserted inside text\nnodes explicitly:\n\n```ocaml\np [] [txt \"hello, \"; txt \"world!\"];;\n(* \u003cp\u003ehello, world!\u003c/p\u003e *)\n```\n\nYou can also conveniently hot-reload the webapp in the browser using the\n`Dream_html.Livereload` module. See the API reference for details.\n\n## Form validation\n\nThere is also a module with helpers for request form and query validation; see\n[`Dream_html.Form`](https://yawaramin.github.io/dream-html/dream-html/Dream_html/Form/index.html)\nfor details. See also the convenience helpers `Dream_html.form` and\n`Dream_html.query`.\n\n## Type-safe path parameter parsing and printing\n\nType-safe wrappers for Dream routing functionality are provided; details are\nshown in the\n[`Dream_html`](https://yawaramin.github.io/dream-html/dream-html/Dream_html/#type-safe-routing) page.\n\nSee also the\n[PPX](https://yawaramin.github.io/dream-html/dream-html/Ppx/index.html)\ndocumentation for setup and usage instructions.\n\n## Import HTML\n\nOne issue that you may come across is that the syntax of HTML is different from\nthe syntax of dream-html markup. To ease this problem, you may use the\ntranslation webapp in the [landing page](https://yawaramin.github.io/dream-html/).\n\nNote that the dream-html code is not formatted nicely, because the expectation is\nthat you will use ocamlformat to fix the formatting.\n\nAlso note that the translation done by this bookmarklet is on a best-effort\nbasis. Many web pages don't strictly conform to the rules of correct HTML\nmarkup, so you will likely need to fix those issues for your build to work.\n\n## Test\n\nRun the test and print out diff if it fails:\n\n    dune test # Will also exit 1 on failure\n\nSet the new version of the output as correct:\n\n    dune promote\n\n## Prior art/design notes\n\nSurface design obviously lifted straight from\n[elm-html](https://package.elm-lang.org/packages/elm/html/latest/).\n\nImplementation inspired by both elm-html and\n[ScalaTags](https://com-lihaoyi.github.io/scalatags/).\n\nMany languages and libraries have similar HTML embedded DSLs:\n\n- [Phlex](https://www.phlex.fun/) - Ruby\n- [Arbre](https://activeadmin.github.io/arbre/) - Ruby\n- [hiccl](https://github.com/garlic0x1/hiccl) - Common Lisp\n- [scribble-html-lib](https://docs.racket-lang.org/scribble-pp/html-html.html) -\n  Racket\n- [hiccup](https://github.com/weavejester/hiccup) - Clojure\n- [std/htmlgen](https://nim-lang.org/docs/htmlgen.html) - Nim\n- [Falco.Markup](https://github.com/pimbrouwers/Falco.Markup) - F#\n- [htpy](https://htpy.dev/) - Python\n- [HTML::Tiny](https://metacpan.org/pod/HTML::Tiny) - Perl\n- [j2html](https://j2html.com/) - Java\n- [Lucid](https://github.com/chrisdone/lucid) - Haskell\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fyawaramin%2Fdream-html","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fyawaramin%2Fdream-html","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fyawaramin%2Fdream-html/lists"}