https://github.com/sagorranait/reactjs-gallery-test

Creating a responsive image gallery using React JS
https://github.com/sagorranait/reactjs-gallery-test

autoprefixer dnd-kit dnd-kit-sortable postcss react react-dom tailwindcss

Last synced: 9 days ago
JSON representation

Creating a responsive image gallery using React JS

• Host: GitHub
• URL: https://github.com/sagorranait/reactjs-gallery-test
• Owner: sagorranait
• Created: 2024-06-11T13:41:17.000Z (5 months ago)
• Default Branch: main
• Last Pushed: 2024-06-11T20:13:27.000Z (5 months ago)
• Last Synced: 2024-10-12T00:21:55.815Z (about 1 month ago)
• Topics: autoprefixer, dnd-kit, dnd-kit-sortable, postcss, react, react-dom, tailwindcss
• Language: JavaScript
• Homepage: https://responsive-image-gallery-task.netlify.app
• Size: 1.78 MB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
## Image Gallery Task

A responsive image gallery using React JS with the following features: reordering, deleting multiple images, and setting a feature image.

Live Demo: [https://responsive-image-gallery-task.netlify.app](https://responsive-image-gallery-task.netlify.app)



## Features

 - Gallery Layout: I have used the grid layout for the image gallery. There is a feature image larger than the others' image.

 - Sorting: The gallery images have a reordering functionality that allows users to rearrange the order of pictures in the gallery. For reordering images, The user can drag and drop.

 - Deleting Multiple Images: Users can select and delete multiple images.

 - Setting Feature Image: Users can set a feature image by sorting. The featured image is visually distinct from the other images.

 - User Experience: This project is mobile-friendly and compatible with various devices, including smartphones and tablets.