Author: Jeroen Ooms
Date: 2021-04-16

# Jade: A clean, whitespace-sensitive template language for writing HTML

#### Jeroen Ooms

#### 2021-04-16

Jade is a high performance template engine heavily influenced by Haml. The `rjade` package interfaces to the JavaScript library using V8, the embedded JavaScript engine for R. Below an example of a Jade template, taken from the jade homepage. This example template includes one variable called `youAreUsingJade`.

    doctype html
    html(lang="en")
      head
        title= pageTitle
        script(type='text/javascript').
          if (foo) {
             bar(1 + 5)
          }
      body
        h1 Jade - node template engine
        #container.col
          if youAreUsingJade
            p You are amazing
          else
            p Get on it!
          p.
            Jade is a terse and simple
            templating language with a
            strong focus on performance
            and powerful features.

Converting a template to HTML text involves two steps. The first step compiles the template with some formatting options into a closure. The binding for this is implemented in `jade_compile`.

    # Compile a Jade template in R
    text <- readLines(system.file("examples/test.jade", package = "rjade"))
    tpl <- jade_compile(text, pretty = TRUE)

The second step calls the closure with optionally some local variables to render the output to HTML.

    # Render the template
    tpl()

    <!DOCTYPE html>
    <html lang="en">
      <head>
        <title></title>
        <script type="text/javascript">
          if (foo) {
             bar(1 + 5)
          }
        </script>
      </head>
      <body>
        <h1>Jade - node template engine</h1>
        <div id="container" class="col">
          <p>Get on it!</p>
          <p>
            Jade is a terse and simple
            templating language with a
            strong focus on performance
            and powerful features.
          </p>
        </div>
      </body>
    </html>

Note how the HTML output changes when setting local variables:

    tpl(youAreUsingJade = TRUE)

    <!DOCTYPE html>
    <html lang="en">
      <head>
        <title></title>
        <script type="text/javascript">
          if (foo) {
             bar(1 + 5)
          }
        </script>
      </head>
      <body>
        <h1>Jade - node template engine</h1>
        <div id="container" class="col">
          <p>You are amazing</p>
          <p>
            Jade is a terse and simple
            templating language with a
            strong focus on performance
            and powerful features.
          </p>
        </div>
      </body>
    </html>