Skip to content

pktcodes/stock-photos-react-project-v2

Repository files navigation

Stock Photos 🖼️

PROD [Live] : https://react-stock-photos-v2-prod.netlify.app/

Stock Photos consists of a straightforward user interface where there is a

  • List of random high-quality images from Unsplash API, by default the images shown are set to 10 and search value is set to cat.
  • Search form to query for a specific category of images when filled it and press the Submit button or enter to submit.
  • Loading... will be shown while fetching the images, There was an error if any error has occurred, and No Results Found when there are no matching results for the query.
  • Dark Mode has been implemented where the user can switch between the themes using the Toggle button which changes the colors of the page accordingly and Local storage has been used to persist the preference of the theme when the user revisits the application.
  • Styles are handled by index.css, data fetching and manipulation using React Query & Axios
  • To run the project locally, clone the repo, npm install to install the dependencies, and npm run dev to start up the development server on default port 5173.

Languages

HTML, CSS, JavaScript, ECMAScript, React ~ ContextAPI - Hooks ~ useState, useEffect, useContext

API Endpoint

Unsplash - https://api.unsplash.com/

Deployment / Hosting

Netlify


Note: I have developed this project ~ [17] as part of the React and Projects Course taught by John Smilga..