front__coursera-responsive-design/templates/home.hbs

<div class="home">
  {{> nav activeGallery="active" }}
  <div class="container">
    <div id="home-carousel" class="carousel slide" data-interval="2000">
      <ol class="carousel-indicators">
        {{#each indicators}}
          <li data-target="#home-carousel" data-slide-to="{{this}}"></li>
        {{/each}}
      </ol>

      <div class="carousel-inner" role="listbox">
        {{#each category}}
          {{#if @first}}
        <div class="item active">
          {{else}}
        <div class="item">
          {{/if}}
          <a href="#class?class={{this.name}}"><img src="{{this.animals.[0].image1}}" alt="{{this.name}}"></a>
          <div class="carousel-caption">
            <h2>{{this.name}}</h2>
          </div>
          </div>
        {{/each}}

      <!-- Controls -->
      <a class="left carousel-control" href="#home-carousel" role="button" data-slide="prev">
        <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
        <span class="sr-only">Previous</span>
      </a>
      <a class="right carousel-control" href="#home-carousel" role="button" data-slide="next">
        <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
        <span class="sr-only">Next</span>
      </a>
    </div>
  </div>
</div>