title: What is the use of Breakpoint in slick slider?
body: <p>I am trying to implement a slick slider on my page. While going through the slick documentation they've mentioned that to use slider in a responsive way, follow the code (which I have posted below). I couldn't understand the use of break point. Can anyone explain me the code. I tried googling but didn't find the solution. I have pasted my code below, please go through.</p>
  
  <pre><code>$('.responsive').slick({
   dots: true,
  infinite: false,
  speed: 300,
  slidesToShow: 4,
  slidesToScroll: 4,
  responsive: [
    {
    breakpoint: 1024,
    settings: {
      slidesToShow: 3,
      slidesToScroll: 3,
      infinite: true,
      dots: true
    }
    },
    {
    breakpoint: 600,
    settings: {
      slidesToShow: 2,
      slidesToScroll: 2
    }
    },
  {
    breakpoint: 480,
    settings: {
      slidesToShow: 1,
      slidesToScroll: 1
    }
  }
  // You can unslick at a given breakpoint now by adding:
  // settings: "unslick"
  // instead of a settings object
   ]
  });
  </code></pre>