---

🖼️ Image Gallery App (Frontend)

A modern and fully responsive Image Gallery Application built using
React, Redux Toolkit, Tailwind CSS, and the Unsplash API.

This project allows users to search, explore, and view high-quality images with fast performance, a clean and minimal user interface, and efficient global state management — following real-world frontend development best practices.

---

---

🚀 Features

✅ Fully Responsive (Mobile, Tablet & Desktop)
✅ Image Search using Unsplash API
✅ Redux Toolkit for Global State Management
✅ Loading & Error Handling
✅ Clean, Minimal, and Modern UI
✅ Fast Performance with Vite
✅ Secure API Handling using Environment Variables
✅ Deployed on Vercel

---

---

🛠️ Technologies Used

HTML5 — Page Structure
Tailwind CSS — Styling and Layout
JavaScript (ES6+) — Logic & UI Interactions
React.js — Component-Based Architecture
Redux Toolkit — State Management
Firebase — Authentication (Optional)
Unsplash API — Image Data
Vite — Fast Development & Build Tool

---

📂 Folder Structure

📁 image-gallery-app/ ├── 📁 src/ │ ├── 📁 components/ │ ├── 📁 redux/ │ │ └── 📁 slices/ │ ├── 📁 assets/ │ ├── App.jsx │ ├── main.jsx ├── .env ├── index.html ├── package.json └── README.md

---

📱 Responsive Design

Device	Supported
Mobile	✅
Tablet	✅
Desktop	✅

---

📌 How to Use

Clone the repository:

git clone https://github.com/your-username/image-gallery-app.git
Install dependencies:

npm install
Run the project:

npm run dev
<p align="center"> <img width="1920" height="949" alt="Usage Preview" src="https://github.com/user-attachments/assets/13b43f3c-f4d8-4d5a-a662-e15fe2d78bc1" /> </p>
🎯 Purpose of This Project
Improve React & Redux Toolkit skills

Practice API integration in real projects

Build production-level UI

Learn secure environment variable handling

Showcase project for portfolio or resume

👨‍💻 Author
Taha
Frontend Developer