KnowHow - Gif Finder

This project was bootstrapped with Create React App, using the Redux and Redux Toolkit template.

Setup Instructions

1 | Install Dependencies

To install the dependencies for this project you can use the following commands:

yarn

or

yarn install

2 | Setup Environment Variables

Clone the .env.sample file with the following command:

cp .env.sample .env

and set your Giphy API key.

3 | Start Server

yarn start

Runs the app in the development mode. Open http://localhost:3000 to view it in the browser.

The page will reload if you make edits. You will also see any lint errors in the console.

Main Project Structure

src/
├── components/
│   ├── App
│   ├── GifFinder
│   ├── GifList
│   ├── LikedGifs
│   └── SearchBar
├── reducers/
│   └── likedGifsSlice.js
└── services/
│   └── giphy.js
├── index.js
└── store.js

Technologies Used

• React
• Redux
• Redux Toolkit
  • RTK Query - Used to create services.
• React Router
• Material UI

Screenshots