JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="//cdn.jsdelivr.net/npm/[email protected]/slick/slick.css">
<script src="//cdn.jsdelivr.net/npm/[email protected]/slick/slick.min.js"></script>
<div class="carousel">
  <div>I'm current</div>
  <div>k,</div>
  <div>vcxx</div>
  <div>vxv</div>
  <div>hjg</div>
  <div>test</div>
</div>

CSS

.inCollection {
  color: red;
}

JavaScript

$('.carousel').slick({

  slidesToShow: 2,
  slidesToScroll: 3,
  centerMode: true

}).on('afterChange', function(event, slick, currentSlide, nextSlide) {

  $('.slick-current',this).prev().text("Im Previous");
  $('.slick-current',this).text("Im Current");
  $('.slick-current',this).next().text("Im After");

});