Skip to content

About

DSL for creating HTML

Resources

Stars

76 stars

Watchers

13 watching

Forks

Latest commit

 

History

29 Commits

Folders and files

NameName
Last commit message
Last commit date
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

html_builder Build Status

DSL for creating HTML programatically (extracted from Crystal's standard library).

Installation

Add this to your application's shard.yml:

dependencies:
  html_builder:
    github: crystal-lang/html_builder

Usage

Basic usage

require "html_builder"

html = HTML.build do
  a(href: "http://crystal-lang.org") do
    text "crystal is awesome"
  end
end

puts html

Output (this output is formatted for better display):

<a href="http://crystal-lang.org">
  crystal is awesome
</a>

Full HTML5 page

html = HTML.build do
  doctype
  html(lang: "pt-BR") do
    head do
      title { text "Crystal Programming Language" }

      meta(charset: "UTF-8")
    end
    body do
      a(href: "http://crystal-lang.org") { text "Crystal rocks!" }
      form(method: "POST") do
        input(name: "name")
      end
    end
  end
end

puts html

Output :

<!DOCTYPE html>

<html lang="pt-BR">
  <head>
    <title>Crystal Programming Language</title>

    <meta charset="UTF-8">
  </head>

  <body>
    <a href="http://crystal-lang.org">Crystal rocks!</a>
    <form method="POST">
      <input name="name">
    </form>
  </body>
</html>

Custom tags

html = HTML.build do
  tag("v-button", to: "home") { text "Home" }
end

puts html

Output:

<v-button to="home">
  Home
</v-button>

Safety

HTML::Builder escapes attribute values:

html = HTML.build do
  a(href: "<>") { }
end

puts html

Output:

<a href="&lt;&gt;"></a>

And escapes text:

html = HTML.build do
  a { text "<>" }
end

puts html

Output:

<a>&lt;&gt;</a>

Contributing

  1. Fork it ( https://github.com/crystal-lang/html_builder/fork )
  2. Create your feature branch (git checkout -b my-new-feature)
  3. Commit your changes (git commit -am 'Add some feature')
  4. Push to the branch (git push origin my-new-feature)
  5. Create a new Pull Request

About

DSL for creating HTML

Resources

Stars

76 stars

Watchers

13 watching

Forks

Releases

Sponsor this project

Packages

Used by

Contributors

Languages