Rise Upp App

An application that allows users to search for a collection of pictures.

Usage

git clone <github repository link>  //to clone the github repository
npm install                         //to install all the dependencies required to run application
npm start                           //to start the application

Configure your own auth on auth0.com

when running on your machine:

• set Allowed Callback Urls: http://localhost:yourport
• set Allowed Logout Urls: http://localhost:yourport
• set Allowed Web Origins: http://localhost:yourport

Development

Tech Stack

Frontend - ReactJS (Redux store & Redux-thunk)

Features and Functionality

• Login, authentication using auth0.
• App consist of Input section, picture category bar & list of pictures with pagination.
• Home page consists of input Section where user can enter picture category to get a list of pictures.
• State management using react-redux, redux-thunk and @reduxjs/toolkit. (minimalist approach to handling asynchronous logic).
• On clicking on the categories tab will display the respective category images.
• Active category tab on the tab.
• On hover over the picture pop ups the image info.
• Lazy-loading of images.
• No Results view in case of no results for user input.
• Failure view on failure.
• Responsive

Guidelines

• Followed Github Guidelines
  • Made the commits often and made sure the commit messages are concise and specific.
  • Included a README file for explaining the project setup, usage instructions.
• Followed Clean Code Guidelines
• The repo is well-organized and easy to navigate
  • Followed the create-react-app folder structure
• The Application handled all the errors

Resources

API Details

• You are required to register yourself as a developer and get the API keys at https://unsplash.com/developers

• For making the search request and fetching the results use this API https://unsplash.com/documentation#search-photos

Design Files

• Reference: https://wireframe.cc/2AETjp

Previews

Mobile View

Home View

No Results View

Failure View

Desktop View

Home Page

No Results View

Failure view

Demo

Link