Hi everyone, this is my solution of Responsive Room-Homepage using [NextJS, CSS Grid, Flexbox]. For me, the most difficult parts are <img srcset="" sizes=""> and the sizing of image slider. I'm happy to complete this challenge.
Any comment would be appreciated. Thank you! :D
Hey! Great solution👍. I also tried using <img srcset="" sizes=""> in my solution to this challenge; however, that didn't work out for me. So I used this instead:
<picture >
<source
media="(max-width: 450px)"
srcset={item.images.mobile}
/>
<img
src={item.images.desktop}
alt="hero"
/>
</picture>
This method allowed me to use different hero images for varying screen sizes. Hope this helped.😊
Hi all! Just getting some nice React practice in. Decided to take a different approach on the original design tho... from a UX standpoint it just didn't make sense if the filters are inside the actual job listing itself. This results in some filter options disappearing when active. So I opted to place filter buttons on the top of the page, as sort of a header component. Only the coding languages are now mapped inside the job listing component itself.
Let me know your idea's if you think this should be done better or different. :)
Hey! Great solution, it looks really cool. However, with your different approach, how would a user filter job listings by programming language?
