Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/akiran/react-slick

React carousel component
https://github.com/akiran/react-slick

carousel react slick

Last synced: 5 days ago
JSON representation

React carousel component

Awesome Lists containing this project

README 

        
### react-slick



[![Backers on Open Collective](https://opencollective.com/react-slick/backers/badge.svg)](#backers) [![Sponsors on Open Collective](https://opencollective.com/react-slick/sponsors/badge.svg)](#sponsors)



##### Carousel component built with React. It is a react port of [slick carousel](http://kenwheeler.github.io/slick/)



## [Documentation](http://react-slick.neostack.com)



### Installation



**npm**



```bash

npm install react-slick --save

```



**yarn**



```bash

yarn add react-slick

```



**Also install slick-carousel for css and font**



```bash

npm install slick-carousel



// Import css files

import "slick-carousel/slick/slick.css";

import "slick-carousel/slick/slick-theme.css";

```



or add cdn link in your html



```html



```



### [PlayGround](https://stackblitz.com/edit/vitejs-vite-ownrun?file=src%2FImageSlider.jsx)



### Example



```js

import React from "react";

import Slider from "react-slick";



export default function SimpleSlider() {

  var settings = {

    dots: true,

    infinite: true,

    speed: 500,

    slidesToShow: 1,

    slidesToScroll: 1

  };

  return (

    

      


        
1


      


      


        
2


      


      


        
3


      


      


        
4


      


      


        
5


      


      


        
6


      


    

  );

}

```



### Props



For all available props, go [here](https://react-slick.neostack.com/docs/api/).



### Methods



For all available methods, go [here](https://react-slick.neostack.com/docs/api#methods)



### Development



Want to run demos locally



```bash

git clone https://github.com/akiran/react-slick

cd react-slick

npm install

npm start

open http://localhost:8080

```



## Community



Join our [discord channel](https://discord.gg/z7stRE4Cyb) to discuss react-slick bugs and ask for help



## Contributing



Please see the [contributing guidelines](./CONTRIBUTING.md)