CodeNewbie Community ๐ŸŒฑ


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

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

#2 using react-masonry-css
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 (3)

rubynolte profile image
RubyNolte • Edited

I appreciate your input on this. I deal with pictures and videos all the time. And stock materials are now essential for this. For instance, I was able to get korea flag photos I required for my presentation. Thanks to this source there are so many excellent ones available.

theplebdev profile image
zakiazfar profile image

it is not for masonry layout