Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/stephenkati/unsplash-image-hub

A web app that provides unsplash image collections. It provides detailed information for each collection a user clicks.
https://github.com/stephenkati/unsplash-image-hub

collections images javascript react redux unsplash-api

Last synced: 18 days ago
JSON representation

A web app that provides unsplash image collections. It provides detailed information for each collection a user clicks.

Awesome Lists containing this project

README 

        





  

 

  



  
Unsplash Image Hub






# 📗 Table of Contents



- [📖 About the Project](#about-project)

  - [🛠 Built With](#built-with)

    - [Tech Stack](#tech-stack)

    - [Key Features](#key-features)

  - [🚀 Live Demo](#live-demo)

- [💻 Getting Started](#getting-started)

  - [Setup](#setup)

  - [Prerequisites](#prerequisites)

  - [Install](#install)

  - [Usage](#usage)

  - [Run tests](#run-tests)

  - [Deployment](#triangular_flag_on_post-deployment)

- [👥 Authors](#authors)

- [🔭 Future Features](#future-features)

- [🤝 Contributing](#contributing)

- [⭐️ Show your support](#support)

- [🙏 Acknowledgements](#acknowledgements)

- [Video-presentation](#presentation)

- [❓ FAQ (OPTIONAL)](#faq)

- [📝 License](#license)



# 📖 [Unsplash Image Hub]



 **[Unsplash Image Hub]** provides collections from unsplash API. A user can interact with any collection by clicking on it to view details. A user can search for a collection and navigate through pages.



## 🛠 Built With 



### Tech Stack 



  Client

  



  Server

  



Database

  



### Key Features 



- **[Used Linters]**

- **[Great summary for the repo]**

- **[Use of GitFlow]**



(back to top)



## 💻 Getting Started 



- A new developer can get the project from my Github repo link i shall provide.



- To get a local copy up and running, follow these steps.



- go to https://github.com/stephenkati/Unsplash-Image-Hub.git



- clone or download the project



- Run `npm install`

- Run `npm start`



### Prerequisites



In order to run this project you need:



- A code editor, preferably VSCode. Any other code editor is okay.



- Browser



### Setup



Clone this repository to your desired folder:



- Run `git clone https://github.com/stephenkati/Unsplash-Image-Hub.git`

- cd `Unsplash-Image-Hub`



### Install



Install this project with:



- Download the project from github and run it in your browser.



- Install dependencies.

- `npm install`



### Usage



- To run the project, navigate to the project directory and use a live Server extension in your VSCode to run the project.



Run `npm start` 



### Run tests



You can run tests to check for linter errors by running the following commands:



- `npx stylelint "**/*.{css,scss}"` for testing css errors

- `npx eslint "**/*.{js,jsx}"` for Javascript errors



(back to top)



## Deployment



The project is deployed on [Render](https://image-hub.onrender.com/)



## 👥 Author 



👤 **Stephen Katuli**



- GitHub: [@githubhandle](https://github.com/stephenkati)

- LinkedIn: [LinkedIn](https://www.linkedin.com/in/stephen-katuli/)



(back to top)



## 🔭 Future Features 



- [ ] **[More backround images]**

- [ ] **[Animations and transitions]**

- [ ] **[More Javascript Functionality]**



(back to top)



## 🤝 Contributing 



- Contributions, issues, and feature requests are welcome!



- Feel free to check the [issues page](https://github.com/stephenkati/Unsplash-Image-Hub/issues).



(back to top)



## ⭐️ Show your support 



If you like this project please reach out to me on my social media, hire me for more content like this.



(back to top)



## 🙏 Acknowledgments 



- I would like to thankmy Microverse team and my coding partners for their support and guidance.

- I am very grateful to [Nelson Sakwa on Behance](https://www.behance.net/gallery/31579789/Ballhead-App-(Free-PSDs)) for the design I used.



(back to top)



##  PRESENTATION  



**PROJECT PRESENTATION VIDEO**



[Here](https://www.loom.com/share/74ec45675a46410983d33438bb5a8495) is a video presentation.



## ❓ FAQ (OPTIONAL) 



- **[How good are your communication skills?]**



  - [I have good writting and speaking communication skills in English.]



- **[What else do you do apart from coding?]**



  - [I do graphics design.]



(back to top)



## 📝 License 



This project is [MIT](/LICENSE) licensed.



(back to top)