slide3_carousel v0.2.1

Getting Started with slide3_carousel

This package allow you to import slider with 3 cards including Image and title text with a sub title text. You can install the package using bellow mentioned command.

npm i slide3_carousel

Important

Please install react boostrap using following command

npm install react-bootstrap bootstrap

then you have to import boostrap css file to the index.js file as bellow mentioned.

import 'bootstrap/dist/css/bootstrap.min.css';

Coding example

import Carousel from 'slide3_carousel'

function App() {

const data =[
{
    "image": "https://media.istockphoto.com/photos/barber-using-scissors-and-comb-picture-id640274128?k=20&m=640274128&s=612x612&w=0&h=XuetWJSNoLnN7f1t0CjGqLVi_P7uxdvuLG5iOvs7yjc=",
    "title": "Haircut",
    "description": "Lorem ipsum dolor sit amet, conse adipiscing elit, sed do eiusmod tempor incididunt ut."
},
{
    "image": "https://media.istockphoto.com/photos/cropped-shot-of-female-client-receiving-a-haircut-picture-id961867192?k=20&m=961867192&s=612x612&w=0&h=89JWTKGPFGql7058Du1Dg4y3OjF0tXhlN9H8hPj5y6k=",
    "title": "Hair Styling",
    "description": "Lorem ipsum dolor sit amet, conse adipiscing elit, sed do eiusmod tempor incididunt ut."
},
{
    "image": "https://media.gettyimages.com/photos/young-woman-at-the-hairdressers-picture-id170173618?s=612x612",
    "title": "Makeup",
    "description": "Lorem ipsum dolor sit amet, conse adipiscing elit, sed do eiusmod tempor incididunt ut." 
},
{
    "image": "https://media.istockphoto.com/photos/business-woman-lady-boss-in-beauty-salon-making-hairdress-and-looking-picture-id1147811403?k=20&m=1147811403&s=612x612&w=0&h=lBbmmhPxES33OgnJgkzvtURRSs_gRvD7kX65gETQ9r8=",
    "title": "Tatto",
    "description": "Lorem ipsum dolor sit amet, conse adipiscing elit, sed do eiusmod tempor incididunt ut."
},
{
    "image": "https://media.gettyimages.com/photos/young-woman-at-the-hairdressers-picture-id170173618?s=612x612",
    "title": "Coloring",
    "description": "Lorem ipsum dolor sit amet, conse adipiscing elit, sed do eiusmod tempor incididunt ut."
}

]

return ( `

</div>`

); }

export default App;