https://github.com/sauravrwt/wallpaper-app
Art-Gallery Web-App with made up of reactjs uses Pexel api to deliver high-quality wallpaper content. The website offers a wide variety of wallpapers for users to choose from, and the content is updated regularly.
https://github.com/sauravrwt/wallpaper-app
masonary-grid pexels-api reactjs simplelightbox wallpaper-app
Last synced: about 2 months ago
JSON representation
Art-Gallery Web-App with made up of reactjs uses Pexel api to deliver high-quality wallpaper content. The website offers a wide variety of wallpapers for users to choose from, and the content is updated regularly.
- Host: GitHub
- URL: https://github.com/sauravrwt/wallpaper-app
- Owner: SauRavRwT
- Created: 2024-04-21T14:33:36.000Z (about 2 years ago)
- Default Branch: main
- Last Pushed: 2026-03-10T13:55:18.000Z (4 months ago)
- Last Synced: 2026-03-10T20:20:58.596Z (4 months ago)
- Topics: masonary-grid, pexels-api, reactjs, simplelightbox, wallpaper-app
- Language: JavaScript
- Homepage: https://sauravrwt.github.io/Wallpaper-App/
- Size: 72 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Art-Gallery
## Overview
Art-Gallery is a modern web application built with React.js that provides high-quality wallArt-Gallery using the Pexels API. The application offers:
- High-quality wallpaper collection.
- Regularly updated content.
- Easy navigation system.
- User-friendly interface.
## Features
- Smart Search with Recent Searches (persisted in localStorage).
- Clear cache buttons.
- Advanced Caching System (1-hour duration).
- Responsive Design with Modern UI.
- Infinite Scroll with Intersection Observer.
- SimpleLightbox Image Preview.
- Direct High-Resolution Image Download.
- Search History Pills.
- Suggustions in pills.
- Performance Optimizations with React Hooks.
## Preview
## Installation
### Prerequisites
- Node.js
- npm (Node Package Manager)
### Setup Instructions
1. **Clone the repository**
```bash
git clone https://github.com/SauRavRwT/Wallpaper-App.git
```
2. **Install dependencies**
```bash
cd Wallpaper-App
npm install
```
3. **Configure API Key**
The app reads the key from an environment variable. Follow these steps:
- Obtain your API key from [Pexels](https://www.pexels.com/api/key/).
- Create a `.env` file in the project root (same folder as `package.json`).
- Add the following line, replacing with your actual key:
```env
REACT_APP_PEXELS_API_KEY=YOUR_API_KEY_HERE
```
- Restart the development server if it’s already running.
If the key is missing or invalid, the app will log an error and show no images.
4. **Run the application**
```bash
npm start
```
The application will open at [http://localhost:3000](http://localhost:3000)
## Development
### Available Scripts
- `npm start` - Runs the app in development mode
- `npm run build` - Creates a production build in the `build` folder
## Contributing
We welcome contributions! If you’d like to help improve this project, feel free to fork the repository and submit a Pull Request.