Skip to content
Submitted almost 4 years ago

React and Styled Components solution

Pedro Klepa•80
@pklepa
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...URL shortening API landing page
  • HTML
  • CSS
  • JS
  • API
3intermediate

Design comparison

SolutionDesign

Solution retrospective

I liked this challenge a lot, it has some nice details and interesting API implementation.

I used React with create-react-app as the basis, Styled Components for CSS-in-JS and component reusability and finally although unnecessary, I brought axios for the API integration.

I would love to hear comments about the page.

Cheers

Community feedback

  • Grzegorz Sterczewski•680
    @gsterczewskiPosted almost 4 years ago

    Hey, I like your work.

    Maybe you could consider adding some more support for keyboard navigation? It will make your project more accessibble. Currently it is hard to figure out on which element is focus set.

    Overall good job.

    Cheers!

    1
  • Aniket•160
    @AniketMJPosted almost 4 years ago

    Hey buddy, it's amazing

    I love the loading animation while getting the response from the api!!👍 But I faced one issue is that when you input an incalid URL, it's not giving me a specific error about it

    Except that the UI is gr8 and I do also liked this challenge It was a lot fun creating it

    Here is the link if you want to check it out - https://www.frontendmentor.io/solutions/tailwind-css-html-js-zAMl7yfPD

    1
    Pedro Klepa•80
    @pklepaPosted almost 4 years ago

    Nice catch! It haven't even occurred to me to test what would be the output for an invalid URL, I'll make sure to address it properly. Thanks!

    0

Please log in to post a comment

Log in with GitHub

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