Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Responsive URL shortening app in React Vite, TailwindCSS and Bitly API

@isaac-kiplangat

Desktop design screenshot for the URL shortening API landing page coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
  • API
3intermediate
View challenge

Design comparison


SolutionDesign

Solution retrospective


Building this project posed some challenges, especially in finding a reliable URL shortening API. Bitly emerged as a trustworthy choice, but I'm open to suggestions if you know of other reliable APIs.

The input component gave me a bit of trouble regarding positioning. I ended up using the translate-y-[] utility in Tailwind CSS to achieve the desired layout, but I'm curious if there are better approaches.

Specific Questions for Feedback:

  1. Have you encountered more reliable URL shortening APIs than Bitly that you'd recommend?
  2. What alternative strategies or best practices could improve the positioning of the input component without affecting the short URL divs?
  3. Are there specific areas of the code that may need further clarification or improvements?
  4. How can the overall structure and functionality be enhanced based on best practices?

I've ensured the project is responsive on mobile screens, but any additional insights or suggestions would be highly valued!

Community feedback

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord