React + Typescript cheat sheet
- implement a carousel described here as a React component
<Carousel images={['url1', 'url2']} />
- add an ability to customize
itemWidth
with default value of 130px
- add
frameSize
- number of images displayed at the same time with the default of 3
- add
step
(default 3) - number of images scrolled per click
- add
animationDuration
(default 1000
) - time in ms to show the new portion of images
- (*) add an
infinite
prop (false
by default) - to do the carousel cyclic
<Carousel
images={['url1', 'url2']}
step={3}
frameSize={3}
itemWidth={130}
animationDuration={1000}
infinite={false}
/>
- The title of the page should contain "Carousel"
- The page should contain inputs for:
itemWidth
frameSize
step
fnimationDuration
- Add data-cy attributes:
title
inside h1 tag
next
to the "Next" button