Qs: Live Coding in React

What's React Live Coding ?

Small projects for you to try to solve. Typically in less than 60min.

---

Giphy App

End Result

Should Look Like https://ghyphir.pages.dev/

App Requirements

• Show trending gifs (Giphy API) when no search text is applied • Search gifs by text (Giphy API) • Handle loading and error • View more button • Persist last search in browser • Copy gif URL on click

Technical Requirements

• You must use React. • You may use any JavaScript/CSS libraries (e.g., Tailwind, Axios, etc.). • You are allowed to use resources like Google, Stack Overflow, etc • AI tools such as search engines or autocompleters are allowed, but not generative AI; we want to assess your knowledge first. • UI design will not be evaluated, but clean code structure and thoughtful logic will be.

Submission

• A GitHub repo with your code. • A README that includes setup instructions. • (Optional) A live deployment (e.g., Vercel, Netlify).

Notes

• You’ll need to sign up for a free Giphy Developer account to get an API key. • This challenge is designed to evaluate your practical skills — don’t worry about visual polish. • Creativity and clarity are more important than perfection.

---