Помогите как создать пагинацию для блоков?

У меня есть секция с блоками

    <section class="product__list">
  <div class="list-item">
    <article class="product">
      <div class="product__img">
        <img class="product-image" src="../img/product_1.png">
      </div>
      <div class="product__title">
        <h2>Beatsˣ</h2>
        <p class="product__description">
          Up to 8 hours of battery life</br>
          With&nbsp;Fast&nbsp;Fuel, a 5-minute charge =</br>
          2 hours of playback
        </p>
        <div class="product__buy">
          <p class="product__price">$299.95</p>
          <button class="product__button">BUY NOW</button>
        </div>
      </div>
    </article>

    <article class="product">
      <div class="product__img">
        <img class="product-image" src="../img/product_2.png">
      </div>
      <div class="product__title">
        <h2>Beatsˣ</h2>
        <p class="product__description">
          Up to 8 hours of battery life</br>
          With&nbsp;Fast&nbsp;Fuel, a 5-minute charge =</br>
          2 hours of playback
        </p>
        <div class="product__buy">
          <p class="product__price">$299.95</p>
          <button class="product__button">BUY NOW</button>
        </div>
      </div>
    </article>

    <article class="product">
      <div class="product__img">
        <img src="../img/product_3.png">
      </div>
      <div class="product__title">
        <h2>Beatsˣ</h2>
        <p class="product__description">
          Up to 8 hours of battery life</br>
          With&nbsp;Fast&nbsp;Fuel, a 5-minute charge =</br>
          2 hours of playback
        </p>
        <div class="product__buy">
          <p class="product__price">$299.95</p>
          <button class="product__button">BUY NOW</button>
        </div>
      </div>
    </article>

    <article class="product">
      <div class="product__img">
        <img src="../img/product_4.png">
      </div>
      <div class="product__title">
        <h2>Beatsˣ</h2>
        <p class="product__description">
          Up to 8 hours of battery life</br>
          With&nbsp;Fast&nbsp;Fuel, a 5-minute charge =</br>
          2 hours of playback
        </p>
        <div class="product__buy">
          <p class="product__price">$299.95</p>
          <button class="product__button">BUY NOW</button>
        </div>
      </div>
    </article>

    <article class="product">
      <div class="product__img">
        <img src="../img/product_5.png">
      </div>
      <div class="product__title">
        <h2>Beatsˣ</h2>
        <p class="product__description">
          Up to 8 hours of battery life</br>
          With&nbsp;Fast&nbsp;Fuel, a 5-minute charge =</br>
          2 hours of playback
        </p>
        <div class="product__buy">
          <p class="product__price">$299.95</p>
          <button class="product__button">BUY NOW</button>
        </div>
      </div>
    </article>

    <article class="product">
      <div class="product__img">
        <img src="../img/product_6.png">
      </div>
      <div class="product__title">
        <h2>Beatsˣ</h2>
        <p class="product__description">
          Up to 8 hours of battery life</br>
          With&nbsp;Fast&nbsp;Fuel, a 5-minute charge =</br>
          2 hours of playback
        </p>
        <div class="product__buy">
          <p class="product__price">$299.95</p>
          <button class="product__button">BUY NOW</button>
        </div>
      </div>
    </article>

    <article class="product">
      <div class="product__img">
        <img src="../img/product_7.png">
      </div>
      <div class="product__title">
        <h2>Beatsˣ</h2>
        <p class="product__description">
          Up to 8 hours of battery life</br>
          With&nbsp;Fast&nbsp;Fuel, a 5-minute charge =</br>
          2 hours of playback
        </p>
        <div class="product__buy">
          <p class="product__price">$299.95</p>
          <button class="product__button">BUY NOW</button>
        </div>
      </div>
    </article>

    <article class="product">
      <div class="product__img">
        <img src="../img/product_8.png">
      </div>
      <div class="product__title">
        <h2>Beatsˣ</h2>
        <p class="product__description">
          Up to 8 hours of battery life</br>
          With&nbsp;Fast&nbsp;Fuel, a 5-minute charge =</br>
          2 hours of playback
        </p>
        <div class="product__buy">
          <p class="product__price">$299.95</p>
          <button class="product__button">BUY NOW</button>
        </div>
      </div>
    </article>
  </div>
</section>

То есть секция из 8 блоков, как создать пагинацию на JS, чтобы на странице было всего 6 блоков