here I'm using css grid for the images. For mobile I want to transform this into swipe cards. what is the best way to achieve that?
#how to create responsive swipe cards
tender tree
compact tartan
can you explain a little bit more about what you mean by "swipe card"
tender tree
like this card slider
tender tree
yes, with react passing data from json file
compact tartan
ok so you're using React, not vanilla JS?
compact tartan
ok basically, you need to take your array of all cards and slice it to a new array that only includes the ones visible at the moment
tender tree
okay
compact tartan
const visible = cards.slice(i, i + 3)
then you map over these and render them
plus some buttons that just increment and decrement i
tender tree
ok basically, you need to take your array of all cards and slice it to a new arr...
i can just use media query for grid and use 1fr
compact tartan
ok but you only need to show some of the cards at once
tender tree
plus some buttons that just increment and decrement `i`
for mobile I want touch functionality
compact tartan
you can't show all the cards at once
compact tartan
for mobile I want touch functionality
there's JS touch events for swipes IIRC, never worked with them before
sour matrix
compact tartan
I probably should have mentioned using a package first
It’s a better idea than making your own if you’re looking to make a real product, but if you’re just trying to learn react then I’d suggest implementing it yourself
It doesn’t seem like you’re very far along in learning React, so building it yourself will help you get a little more practice
