https://github.com/stroller15/gifs-search-app

A React-based GIF search application that leverages the GIF API for finding and sharing the perfect GIFs.
https://github.com/stroller15/gifs-search-app

api javascript reactjs

Last synced: 3 months ago
JSON representation

A React-based GIF search application that leverages the GIF API for finding and sharing the perfect GIFs.

• Host: GitHub
• URL: https://github.com/stroller15/gifs-search-app
• Owner: Stroller15
• Created: 2023-07-27T08:35:55.000Z (over 2 years ago)
• Default Branch: master
• Last Pushed: 2023-08-06T16:17:11.000Z (over 2 years ago)
• Last Synced: 2025-02-15T09:48:43.503Z (about 1 year ago)
• Topics: api, javascript, reactjs
• Language: CSS
• Homepage: https://gifs-search.vercel.app/
• Size: 692 KB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# Gifs Search

Problem statement

Design & develop the frontend for a application to search GIFs

Features

The following are the most fundamental features of the app:

1. The app should have a search for searching gifs

2. Create a fluid layout

3. The app should have infinite scrolling support

### Large device view

![image](https://github.com/Stroller15/setu-assignment/assets/84174011/1498602f-6f21-4208-a1d5-b2511e4e22cb)

### Medium device view

![image](https://github.com/Stroller15/setu-assignment/assets/84174011/01c2e205-7506-4aa7-8fd5-37d598bdf2a3)

### Small device view

![image](https://github.com/Stroller15/setu-assignment/assets/84174011/24ca8705-f08b-4824-b7de-e94f08e8421a)

### Folder structure tree

```

├── public

│   ├── index.html

├── src

│   ├── assests

│   │   ├── gif

│   │   ├── svgs

│   ├── commons

│   │   ├── input.js

│   ├── components

│   │   ├── NavBar

│   │   ├── SearchBar

│   │   ├── Spinner

│   │   ├── GifRoute

│   ├── pages

│   │   ├── Giphy

│   │   ├── ErrorPage.js

│   ├── App.css

│   ├── App.js

│   ├── index.js

├── .env

├── .gitignore

├── jsconfig.json

├── package-lock.json

├── package.json

└── 

```