GalleryApp is a powerful and dynamic web application developed using React, Redux, and Material-UI (MUI). It allows users to seamlessly browse, search, filter, download, and favorite high-quality images sourced from the Unsplash API.
🎨 It was firstly designed on Figma: https://www.figma.com/file/L6XNA2CBOQnaCt2TegDpI9/GalleryApp---MUI-(Material-Design-Component-Figma-Library-For-React)?type=design&node-id=729-2702&t=pkqAvQSqwLrLpJ28-0
💻 Deployed on GitHub Pages. You can visualize this project at: https://davidrami12.github.io/GalleryApp/
- HTML
- CSS
- JavaScript
- React
- Redux
- Material-UI
- Unsplash API
- Toastify
- Home Page: The application's main page.
- Search Page: Connected to the Unsplash API, this page allows users to search for images by topic. With no input data, the search button will generate random images.
- Favorites Page: All images added to the favorites will be displayed here. Users can download, edit the description, or delete them from favorites. You can also filter your favorited images by date, width, height and number of likes.
- Node.js installed (v14 or later recommended)
- NPM (v6 or later) or Yarn (v1.22 or later)
- Clone the repository
git clone https://github.com/Davidrami12/GalleryApp.git
cd GalleryApp- Install NPM packages
npm installor
yarn install- Create a .env file in the root directory of the project, and add the Unsplash API key
REACT_APP_UNSPLASH_API_KEY=your_unsplash_api_key_here- Run the app in the development mode
npm startor
yarn start
Open http://localhost:3000 to view it in the browser.
Navigate to the Search page and input a topic to retrieve images related to your query. To add an image to your Favorites, simply click on the heart icon. Visit the Favorites page to view all your favorite images.
This project is under the MIT license, and contributions are welcome. Please feel free to fork, create a feature branch, and submit a pull request. If you want to contribute to this project and make it better, your help is very welcome.