DEV Community

Cover image for Building a Responsive Image Gallery with Next.js, TypeScript, and Tailwind CSS

Building a Responsive Image Gallery with Next.js, TypeScript, and Tailwind CSS

Sanjana Kumari on February 26, 2024

Introduction: In this beginner-friendly tutorial, we'll dive into the world of building a responsive image gallery with modal functional...
Read full post
Collapse
 
shubhamtiwari909 profile image
Shubham Tiwari • • Edited

Few pointers -

  • For adding code blocks in your blogs, add the language extension after the 3 backticks like this
    Image description
    It will show the code just like code editors show for JS code

  • For this code

const nextIndex =  currentImageIndex === images.length - 1 ? 0 : currentImageIndex + 1;
Enter fullscreen mode Exit fullscreen mode

Could be replaced by this

currentImageIndex = (currentImageIndex + 1) % images.length;
Enter fullscreen mode Exit fullscreen mode

Does the same work

Collapse
 
theedgebreaker profile image
Sanjana Kumari •

Thanks for the insightful comments!
I'll be sure to add language extensions to code blocks in future posts. And you're spot on about using the modulo operator – it's a cleaner solution. I'll update the post accordingly.

Appreciate your input!