Using Flickity with React

Photo by Henry Be on Unsplash

I love using Flickity, it’s great and super easy to use. But… When I started to work with React and need Flickity, things got pretty confusing. So I started to look for a component style library but find nothing effective. And built mine…

#1. Install flickity 👾

You can install flickity with;

yarn add flickity

or

npm install flickity --save

#2. Create a file called Slider.js ✍

Slider.js file will contain Flickity configurations. You can of course name it as you want but be careful with naming component name and then importing also 😜

Slider.js component for Flickity

Voilà! You’ve made it! 😍

#3. Use it in a component 😊

Home.js example component

Thanks for reading! 💛

I’m Onur Şuyalçınkaya, Front End Developer at Yemeksepeti and Co-Founder of Minimap. Feel free to connect with me via Twitter and LinkedIn.