URL Shortening API Landing Page - Frontend Mentor

This project is a responsive landing page for a URL shortening API, built using Redux Toolkit (RTK), React, Vite, Tailwind CSS, and the Shrtcode API.

Features

  • Users can input a long URL to shorten
  • Users can view a list of shortened URLs they've previously created
  • Users can copy the shortened URL to their clipboard with one click
  • The app checks if the same URL has already been shortened and retrieves the previously - generated short URL without calling the API again, reducing unnecessary API calls and - speeding up the user experience.

Tech Stack

  • React ⚛️
  • Redux Toolkit Query (RTK Query) 🔄
  • Vite 🚀
  • Tailwind CSS 🎨
  • Shrtcode API 🔗

Getting Started

1. Clone the repository
2. Install dependencies using npm install
3. Run the app using npm run dev

Screenshots

Desktop View:

D1

Mobile View:

D1

Note: For more images, please check result folder.

Demo

Check out the live demo to try it out for yourself!

Authors