/giphy-grabber

A simple Next.js app that grabs gifs from the Giphy API and displays them in a grid

Primary LanguageTypeScript

Giphy Grabber

A Next.js app that uses the Giphy API to search for GIFs and display them in a grid.

Running the app

0. Prerequisites

  1. Node.js
  2. NPM

1. Install dependencies

npm install

2. Setup environment variables

First, copy the example environment variables file:

cp .env.example .env.local

Then edit the .env.local file and add your Giphy API key in there. You can get one here.

3. Run the app

npm run build
npm start

You can now access the app at http://localhost:3000

Tech stack

  1. Next.js - React framework and server for API routes
  2. Tailwind CSS - CSS framework
  3. Giphy API - GIF search API
  4. Recoil - State management library
  5. SWR - Data fetching library