Photo Gallery App

A simple, modern photo gallery built with React and TypeScript, using the Unsplash API. Browse popular images, search instantly, and view your search history—all with a clean, student-friendly UI (no UI libraries used).

Features

• Home Page: See the 20 most popular images from Unsplash.
• Live Search: Type in the search box and images update instantly (no search button needed).
• Search Caching: Previous search results are cached for faster loading if you search again.
• History Page: View your past search queries. Click any to see those results again.
• Infinite Scroll: More images load automatically as you scroll, on both Home and History pages.
• Image Modal: Click any image to see it full-size, with details like downloads, views, and likes.
• No UI Libraries: 100% custom CSS, no MUI, Bootstrap, or AntD.

Screenshots

Add your screenshots here!

Getting Started

1. Clone the repo:

   git clone https://github.com/Ana7K/acceleration-program.git
   cd acceleration-program

2. Install dependencies:

   npm install

3. Set up Unsplash API:
   • Get a free API key from Unsplash Developers.
   • Create a .env file in the root folder:

     REACT_APP_UNSPLASH_ACCESS_KEY=your_access_key_here

4. Start the app:

   npm start

   The app will open at http://localhost:3000.

Scripts

• npm start — Run the app in development mode
• npm run build — Build for production
• npm test — Run tests

Tech Stack

• React + TypeScript
• Unsplash API
• Custom CSS (no UI libraries)

Project Structure

• src/app/ — Main pages (Home, History, Router)
• src/shared/components/ — Reusable UI components
• src/shared/hooks/ — Custom React hooks (API, infinite scroll, etc.)
• src/shared/types/ — TypeScript types

Credits

Images powered by Unsplash.

---