/unsplash-clone

React based application using Unsplash API

Primary LanguageJavaScript

Gallery App for listing photos from Unsplash

GitHub last commit

This project lists photos from Unsplash API. Users can also search photos and also filter the results based on the color, orientation, and order filters. The photos are listed using infinite scroll.

Screenshot 2022-05-24 at 6 56 01 PM

Screenshot 2022-05-24 at 6 57 13 PM

Screenshot 2022-05-24 at 6 57 28 PM

API Key (Client ID)

The Unsplash client Id can be generated using the developer account. The client id is specified in the .env.local file in the project root directory and the environment variable namely NEXT_PUBLIC_UNSPLASH_CLIENT_ID refers to API client id.

Getting started

  1. Install the dependencies using yarn install
  2. Run the project in development mode using yarn start

Project structure

The project source code can be found in the src directory. The structure is divided in individual modules as:

  1. components: Reusable components across the app
  2. hooks: custom reusable hooks across the app
  3. contexts: context providers across the app
  4. pages: application pages
  5. utils: application helpers
  6. services: includes apis and other services
  7. assets: all the application assets
  8. tests: wrappers and helpers for unit and E2e testing

Each modules can be accessed using the aliases such as @components as specified in the jsconfig.json. Also for testing as specified in jest config in the package.json.