URL shortener web application using React and Tailwind CSS

What are you most proud of, and what would you do differently next time?

What I’m most proud of: I’m most proud of how I was able to design and implement a clean, responsive, and user-friendly UI for the URL shortener app using React and Tailwind CSS, while also integrating the Bitly API to handle link shortening efficiently. I’m particularly happy with the real-time feedback system, where users get instant validation errors or success messages, and the smooth API interaction with proper error handling. What I’d do differently next time: Next time, I would build a custom backend service with Node.js, Express, and MongoDB so I could store user-generated links, add authentication and link history tracking, and avoid reliance on third-party API limits. I’d also incorporate analytics features so users can track click counts and trends for their shortened links, making the tool more functional and data-driven.

What challenges did you encounter, and how did you overcome them?

Challenges and How I Overcame Them: One major challenge was validating user input to ensure only properly formatted URLs were processed. I solved this by implementing a regex-based validation check on the client side before sending any API requests. Another challenge was handling API errors and network failures gracefully — especially when the Bitly API returned errors for invalid or duplicate links. I addressed this by adding try-catch blocks, checking HTTP status codes, and displaying clear, user-friendly error messages. Finally, ensuring mobile responsiveness across different screen sizes was tricky, but I overcame this by leveraging Tailwind’s responsive design utilities and thoroughly testing the app using Chrome DevTools’ device simulation.

What specific areas of your project would you like help with?

Areas I’d Like Help With: I’d like feedback on optimizing API calls to make the app faster and reduce unnecessary re-renders when a user submits multiple links in a short time. I’m also looking for suggestions on how to refactor my React components for better scalability — especially if I decide to add authentication, analytics, or a custom backend in the future. Additionally, I’d appreciate guidance on implementing secure link storage and click-tracking features using best practices for performance and security.