JSFiddle - React, Tailwind, and code Playground

HTML

<div class="slick-slider">
  <div><img class="slick-slider-img" src="http://lab.risewill.co.jp/images/web-design/action-sample-img1.jpg" alt="スライドショー画像1"></div>
  <div><img class="slick-slider-img" src="http://lab.risewill.co.jp/images/web-design/action-sample-img2.jpg" alt="スライドショー画像2"></div>
  <div><img class="slick-slider-img" src="http://lab.risewill.co.jp/images/web-design/action-sample-img3.jpg" alt="スライドショー画像3"></div>
  <div><img class="slick-slider-img" src="http://lab.risewill.co.jp/images/web-design/action-sample-img4.jpg" alt="スライドショー画像4"></div>
</div>

SCSS

.slick-slider {
  max-width: 280px
}

.slick-slider-img {
  width: 100%;
  height: 200px;
  object-fit: cover;
}

.slick-arrow {
  &.slick-prev {
    left: 10px;
    z-index: 1;
  }

  &.slick-next {
    right: 10px;
    z-index: 1;
  }
}

JavaScript

$('.slick-slider').slick();