title: What is the difference between data-sly-use, data-sly-resource, data-sly-include, and data-sly-template?
body: <p>What is the difference between: <code>data-sly-use</code>, <code>data-sly-resource</code>, <code>data-sly-include</code>, and <code>data-sly-template</code>? I am reading the doc on <code>Sightly</code> <code>AEM</code> and I am super confused.</p>
  
  <p>As far as I can see:</p>
  
  <ul>
  <li><code>data-sly-use</code> is used to add <code>js/java</code> files to render with the doc</li>
  <li><code>data-sly-resource</code> is used to inject components</li>
  <li><code>data-sly-include</code> is used to include other html files (?***?)</li>
  </ul>
  
  <p>And, data-sly-template is confusing, as in:</p>
  
  <pre><code>&lt;div data-sly-use.nav="navigation.js"&gt;${nav.foo}&lt;/div&gt;
  &lt;section data-sly-include="path/to/template.html"&gt;&lt;/section&gt;
  &lt;template data-sly-template.one&gt;blah&lt;/template&gt;
  &lt;div data-sly-call="${one}"&gt;&lt;/div&gt;
  </code></pre>