Marker provides components as a convenient abstraction. Under the hood components define a macro, that can be called just like elements, that calls a hidden template function containing the body of the component. The component macro provides two variables: content and attrs. content contains expressions from the do block and is always a list. attrs contains the attributes and is always a map.

An example makes this all probably much easier to understand, so here are a few components that could make using Bootstrap simpler:

defmodule MyComponents do
  use Marker
  import Marker.Component

  component :form_input do
    custom_classes = attrs[:class] || ""
    div class: "form-group" do
      label attrs[:label], for: attrs[:id]
      input id: attrs[:id],
            type: attrs[:type],
            class: "form-control " <> custom_classes
            placeholder: attrs[:placeholder],
            value: attrs[:value]
    end
  end

  component :form_select do
    custom_classes = attrs[:class] || ""
    div class: "form-group" do
      label attrs[:label], for: attrs[:id]
      select content, id: attrs[:id], class: "form-control " <> custom_classes
    end
  end

  def test do
    html body do
      form do
        form_input id: "form-address", label: "Address", placeholder: "Fill in address"
        form_select id: "form-country", label: "Country", class: "country-select" do
          option "Netherlands", value: "NL"
          option "Belgium", value: "BE"
          option "Luxembourg", value: "LU"
        end
      end
    end
  end
end

If you want to use components from another module, don’t forget to require or import the module, since components are defined as macros.