DEV Community

Mohd Ahmad
Mohd Ahmad

Posted on

Help! How to make masonry layout in react

Hey there, I am making a react photo gallery app in which I am consuming UNSPLASH API, but I am not able to make a masonry layout in my app.

I have found many techniques to make masonry layouts, but none of them satisfy my needs.

#1 CSS column layout technique
CSS_ERR

problem :: It is mixing previous and newly added photos, and IDK why?

#2 using react-masonry-css
image
problem :: bottom layout is broken

#3 using react-responsive-masonry
problem :: same as #2 bottom layout is broken

#4 using react-photo-gallery
problem :: no support for using next/image and blurhash

#4 using StackGrid
problem :: no support for infinite loading and it is too slow

Top comments (1)

Collapse
 
nwata profile image
N.Watanabe

I'm happy if you could share sourcecode