Basic jade features.

attributes.jade

div(class="movie-card", id="oceans-11")
  h1(class="movie-title") Ocean's 11
  img(src="/img/oceans-11.png", class="movie-poster")
  ul(class="genre-list")
    li Comedy
    li Thriller

interpolation.jade

- var profileName = "Danny Ocean";
div
  p Hi there, #{profileName}. How are you doing?

js.jade

- var x = 5;
div
  ul
    - for (var i=1; i<=x; i++) {
      li Hello
    - }

loops.jade

- var droids = ["R2D2", "C3PO", "BB8"];
div
  h1 Famous Droids from Star Wars
  for name in droids
    div.card
      h2= name

mixins.jade

// creation
mixin thumbnail(imageName, caption)
  div.thumbnail
    img(src="/img/#{imageName}.jpg")
    h4.image-caption= caption
    
// usage
+thumbnail("the godfather", "capicci?")

tags.jade

div
  p Hello!
  p World!

text-block.jade

div
  p How are you?
  p.
    I'm fine thank you.
    And you? I heard you fell into a lake?
    That's rather unfortunate. I hate it when my shoes get wet.